<!-- 地震应急快速出图-断层分布图 -->
<template>
  <div id="seismotectonicsMap-map" style="width:100%;height:100%;"></div>
  <div id="seismotectonicsMap-mapDiv" class="ol-popup">
    <!-- 显示控件 -->
    <div id="seismotectonicsMap-setDivPosition" class="init-setDivPosition" style="margin-top:25px">
      <!-- 切换卫星和街道地图 -->
      <p @click="switchMap" class="init-setDivPosition-selected">
        <template v-if="switchMapBool == false">
          <img src="@/assets/map/image/weixing-b.png" title="切换卫星地图"><br /><span>卫星图</span>
        </template>
        <template v-else>
          <img src="@/assets/map/image/jiedao-b.png" title="切换街道地图"><br /><span>街道图</span>
        </template>
      </p>
      <!-- 返回主界面 -->
      <p @click="zoomDefaultPosition" :class="{ 'init-setDivPosition-selected': zoomDefaultPositionBool == true }">
        <img src="@/assets/map/image/newImage/home.png" title="返回主界面"><br /><span>主界面</span>
      </p>
      <!-- 显示工具箱 -->
      <p @click="showHideToolsBoxDiv" :class="{ 'init-setDivPosition-selected': showHideToolsBox == false }">
        <template v-if="showHideToolsBox">
          <img src="@/assets/map/image/tools.png" title="打开工具箱"><br /><span>工具箱</span>
        </template>
        <template v-else>
          <img src="@/assets/map/image/tools.png" title="关闭工具箱"><br /><span>工具箱</span>
        </template>
      </p>
      <!-- 图件生成 -->
      <p @click="createImgFuntion">
        <!-- <template v-if="createImgBool"> -->
        <img src="@/assets/map/image/icon-图件生成.png" title="手动出图"><br /><span>手动出图</span>
        <!-- </template>
        <template v-else>
          <img src="@/assets/map/image/icon-图件生成.png" title="手动出图"><br /><span style="border:0;">手动出图</span>
        </template> -->
      </p>
      <p style="position: relative">
        <EqRapidReport title="地震构造图" :type="type" style="position: absolute;left:0;top:0;width: 100%;height: 100%;">
          <template #clickDom>
            <div>
              <img src="@/assets/map/image/icon-图件生成.png" title="地震速报"><br />
              <span style="border:0;">地震速报</span>
            </div>
          </template>
        </EqRapidReport>
      </p>
    </div>
    <!-- 工具箱 -->
    <div id="seismotectonicsMap-ToolsBoxDiv" class="init-ToolsBoxDiv">
      <p @click="measureToolBox" :class="{ 'init-setDivPosition-selected': showHideMeasureTool == false }">
        <template v-if="showHideMeasureTool">
          <img title="开启测量工具" src="@/assets/map/image/cel.png"><br /><span>测量</span>
        </template>
        <template v-else>
          <img title="关闭测量工具" src="@/assets/map/image/cel.png"><br /><span>测量</span>
        </template>
      </p>
      <p @click="positionToolBox" :class="{ 'init-setDivPosition-selected': showHidePositionTool == false }">
        <template v-if="showHidePositionTool">
          <img title="开启定位工具" src="@/assets/map/image/dingw.png"><br /><span style="border:0;">定位</span>
        </template>
        <template v-else>
          <img title="关闭定位工具" src="@/assets/map/image/dingw.png"><br /><span style="border:0;">定位</span>
        </template>
      </p>
    </div>
    <!-- 所有工具 -->
    <div id="seismotectonicsMap-AllToolsDiv" class="init-AllToolsDiv">
      <!-- 测量工具 -->
      <div id="seismotectonicsMap-MeasureToolsDiv" class="init-AllToolsDivFloat">
        <p @click="measureDistance" :class="{ 'init-setDivPosition-selected': measureDistanceBool == false }">
          <template v-if="measureDistanceBool">
            <img src="@/assets/map/image/jul.png" title="测量距离（在地图上单击鼠标左键绘制折线，双击完成测量）"><br /><span>测量距离</span>
          </template>
          <template v-else>
            <img src="@/assets/map/image/jul.png" title="测量距离（在地图上单击鼠标左键绘制折线，双击完成测量）"><br /><span>测量距离</span>
          </template>
        </p>
        <p class="init-AllToolsDiv-split"></p>
        <p @click="measureArea" :class="{ 'init-setDivPosition-selected': measureAreaBool == false }">
          <template v-if="measureAreaBool">
            <img src="@/assets/map/image/mianj.png" title="测量面积（在地图上单击鼠标左键绘制多边形，双击完成测量）"><br /><span>测量面积</span>
          </template>
          <template v-else>
            <img src="@/assets/map/image/mianj.png" title="测量面积（在地图上单击鼠标左键绘制多边形，双击完成测量）"><br /><span>测量面积</span>
          </template>
        </p>
        <p class="init-AllToolsDiv-split"></p>
        <p @click="stopMeasure" :class="{ 'init-setDivPosition-selected': stopMeasureBool == false }">
          <template v-if="stopMeasureBool">
            <img src="@/assets/map/image/jshz.png" title="取消测量距离或测量面积操作"><br /><span>结束测量</span>
          </template>
          <template v-else>
            <img src="@/assets/map/image/jshz.png" title="取消测量距离或测量面积操作"><br /><span>结束测量</span>
          </template>
        </p>
        <p class="init-AllToolsDiv-split"></p>
        <p @click="clearMeasure" :class="{ 'init-setDivPosition-selected': clearMeasureBool == false }">
          <template v-if="clearMeasureBool">
            <img src="@/assets/map/image/qux.png" title="清空全部测量结果"><br /><span>清空结果</span>
          </template>
          <template v-else>
            <img src="@/assets/map/image/qux.png" title="清空全部测量结果"><br /><span>清空结果</span>
          </template>
        </p>
      </div>
      <!-- 定位工具 -->
      <div id="seismotectonicsMap-MousePositionDiv">
        <span><img class="init-jingd" src="@/assets/map/image/jingd.png" title="鼠标左键在地图上点击位置的经度值"></span>
        <input id="seismotectonicsMap-MousePositionLon" type="text" value="">
        <span><img class="init-weid" src="@/assets/map/image/weid.png" title="鼠标左键在地图上点击位置的纬度值"></span>
        <input id="seismotectonicsMap-MousePositionLat" type="text" value="">
        <p @click="clearPosition" :class="{ 'init-setDivPosition-selected': clearPositionBool == false }">
          <template v-if="clearPositionBool">
            <img src="@/assets/map/image/qux.png" title="清空全部定位点图标"><br /><span>清空结果</span>
          </template>
          <template v-else>
            <img src="@/assets/map/image/qux.png" title="清空全部定位点图标"><br /><span>清空结果</span>
          </template>
        </p>
        <p class="init-AllToolsDiv-split"></p>
        <p @click="addPosition" :class="{ 'init-setDivPosition-selected': addPositionBool == false }">
          <template v-if="addPositionBool">
            <img src="@/assets/map/image/dingwd.png" title="根据经纬度值在地图上添加定位点图标"><br /><span>添加定位点</span>
          </template>
          <template v-else>
            <img src="@/assets/map/image/dingwd.png" title="根据经纬度值在地图上添加定位点图标"><br /><span>添加定位点</span>
          </template>
        </p>
      </div>
    </div>
  </div>
</template>
<script>
  import EqRapidReport from '@/views/quickMapping/common/eqRapidReport/index.vue'
  import '@/assets/map/ol/ol.css';
  // import { getProjection, getWMTSLayer, getRESTLayer, getResolutions } from "@/map/projMap.js";
  import { getProjection, getWMTSLayer, getRESTLayer,iServerHttp, getResolutions } from "./projMap.js";
  import Map from 'ol/Map';
  import View from 'ol/View';
  import TileLayer from 'ol/layer/Tile';
  import TileGrid from 'ol/tilegrid/TileGrid';
  import VectorLayer from 'ol/layer/Vector';
  import { Cluster, Vector as VectorSource, XYZ } from 'ol/source'
  import WMTS from 'ol/source/WMTS';
  import { getWidth, getTopLeft } from 'ol/extent';
  import { Control, defaults as defaultControls } from 'ol/control';
  import GeoJSON from 'ol/format/GeoJSON';
  import WKT from 'ol/format/WKT';
  import Overlay from 'ol/Overlay';
  import Feature from 'ol/Feature';
  import Point from 'ol/geom/Point';
  import Polygon from 'ol/geom/Polygon';
  import LineString from 'ol/geom/LineString';
  import { Fill, Stroke, Style, Icon, Circle, Text } from 'ol/style';
  import { Select, Draw, Modify, Snap, Translate } from 'ol/interaction';
  import { getArea, getLength } from 'ol/sphere';
  import { unByKey } from 'ol/Observable';
  import * as olExtent from 'ol/extent';
  import { createBox } from 'ol/interaction/Draw';
  import { boundingExtent } from 'ol/extent';
  import {
    TileSuperMapRest, Logo,
    QueryService, QueryBySQLParameters, QueryByBoundsParameters, QueryByGeometryParameters, QueryByDistanceParameters,
    FeatureService, GetFeaturesByIDsParameters, GetFeaturesBySQLParameters, GetFeaturesByBoundsParameters,
    GetFeaturesByGeometryParameters, GetFeaturesByBufferParameters,
    MapService, ThemeDotDensity, ServerStyle, ThemeParameters, ThemeService,
    ThemeGraduatedSymbol, ThemeGraduatedSymbolStyle, GraduatedMode, ServerColor,
    ThemeGraph, ThemeGraphItem, ThemeGraphAxes, ThemeGraphSize, ThemeGraphText, ThemeGraphTextFormat,
    ServerTextStyle, ThemeGraphType, ThemeLabel, ThemeLabelItem, LabelThemeCell, ThemeLabelBackground,
    ThemeRange, ThemeRangeItem, RangeMode, ThemeUnique, ThemeUniqueItem,
    ThemeGridRange, ThemeGridRangeItem, ThemeGridUnique, ThemeGridUniqueItem,
    LayerStatus, SetLayerStatusParameters
  } from '@supermap/iclient-ol';
  import dingweiImg from '@/assets/map/image/newImage/blueMarker.png';
  import { transform } from 'ol/proj';

  export default {
    name: "SeismotectonicsMap",
    components: {
      EqRapidReport
    },
    props: {
      allRadioIndexData: {//全部序号列表
        type:Array,
        required:true,
        default:[]
      },
      allListData: {//全部查询结果列表
        type: Array,
        required: true,
        default: []
      },
      typeCodeDataList: {//选择图层的版本号数据列表
        type:Array,
        required:true,
        default:[]
      },
      resetClearAllBool: {//是否重置清空全部图层数组
        type:Boolean,
        required:false,
        default:false
      },
      dataTypeInfoArray:{//图层数据类型数组
        type: Array,
        required:false,
        default: []
      },
      type: String
    },
    emits: ["getDetailListByCode","getLegendHtml", "manual"],
    data() {
      return {
        str: "seismotectonicsMap",
        map: null,
        projection4490: null,
        url: "https://iserver.supermap.io/iserver/services/map-china400/rest/maps/China_4326",//中国地图
        center: [105, 34],
        zoom: 4,
        mapLoadingBool: false,//是否正在查询参数
        zoomDefaultPositionBool: true,//显示主界面
        switchMapBool: false,//切换地图
        layer1: null,//天地图街道图
        layer2: null,
        layer3: null,//天地图卫星图
        layer4: null,
        draw: null,//矢量绘制
        snap: null,
        select: null,
        modify: null,
        drag: null,
        source: null,//矢量绘制图层数据
        createImgBool: true,
        measureSource: null,//测量结果图层数据
        measure: null,//测量工具
        sketch: null,
        helpTooltipElement: null,
        helpTooltip: null,
        measureTooltipElement: null,
        measureTooltip: null,
        measureTooltipArray: [],//全部测量结果Overlay数组
        showHideMeasureTool: true,//显示|隐藏测量工具
        measureDistanceBool: true,
        measureAreaBool: true,
        stopMeasureBool: true,
        clearMeasureBool: true,
        showHidePositionTool: true,//显示|隐藏定位工具
        addPositionBool: true,
        clearPositionBool: true,
        popupInfoLayer: null,//弹出窗口
        showHideToolsBox: true,
        //addressMatchService:null,//地址匹配
        addressUrl: "https://iserver.supermap.io/iserver/services/addressmatch-Address/restjsr/v1/address",
        selectFeature: null,//选中要素
        siteVectorLayer: null,//全部活动查询结果图层
        allDataList: [],//全部查询结果数组
        resultLonLatArray: [],//查询经纬度处理结果数组
        allRadioIndexList:[],//全部序号列表
        allRestVectorLayerArray:[],//全部超图图层数组
      }
    },
    watch: {
      allRadioIndexData: {//全部序号列表
        handler: function(newVal,oldVal){
          if(newVal!=oldVal){
            this.allRadioIndexList = newVal;
            //根据全部序号列表设置全部查询图层数组
            this.addAllBaseVectorLayerArray();
            //根据全部序号列表设置全部超图图层数组
            this.addAllRestVectorLayerArray();
          }
        },
        immediate:true
      },
      allListData: {
        handler: function (newVal, oldVal) {
          this.allDataList = newVal;
          if (newVal != oldVal) {
            this.showAllListData();
          }
        },
        immediate: true
      },
      typeCodeDataList: {//选择图层的版本号数据列表
        handler: function(newVal,oldVal){
          if(newVal!=oldVal){
            this.typeCodeDataArray = newVal;
          }
        },
        immediate:true
      },
      resetClearAllBool: {//是否重置清空全部图层数组
        handler: function(newVal,oldVal){
          if(newVal==true){
            //重置清空全部图层数组
            this.resetClearAllEvent();
            //重置清空全部超图图层数组
            this.resetClearAllRestLayerEvent();
          }
        },
        immediate:true
      },
      dataTypeInfoArray:{//图层数据类型数组
        handler: function(newVal,oldVal){
          if(newVal!=oldVal){
            this.allDataTypeInfoArray = newVal;//全部超图图层信息数组
          }
        },
        immediate:true
      },
    },
    created() {

    },
    mounted() {
      let that = this;
      //地图异步加载
      this.$nextTick(function () {
        //地图异步加载
        setTimeout(() => {
          //初始化地图信息
          that.initMap();
          //地图显示全部查询结果
          that.showAllListData();
          //test超图服务
          //that.testAllSuperMap();
        }, 200);
      });
    },

    destroyed() {//生命周期销毁完成
      this.map = null;
    },
    activated() {//如果页面有keep-alive缓存功能激活，这个函数会触发
      //自动获取地图div高度
      // this.autodivheight();
      //浏览器窗口发生变化时同时变化DIV高度
      // window.onresize = this.autodivheight;
    },
    deactivated() {//如果页面有keep-alive缓存功能停用，这个函数会触发
      console.log("deactivated-" + this.str);
      //取消浏览器窗口发生变化时同时变化DIV高度事件
      window.onresize = null;
    },
    methods: {
      initMap() {
        let that = this;
        let mapStr = this.str;
        let targetMap = document.getElementById(mapStr + "-map");
        if (targetMap.innerHTML != "") {
          // console.log("清空targetMap");
        }
        targetMap.innerHTML = "";//清空
        //新建popup弹窗
        let targetDiv = document.getElementById(mapStr + "-mapDiv");
        let node = document.createElement("div");
        node.id = mapStr + "-popup";
        node.setAttribute("class", "new-ol-popup");
        node.innerHTML = '<a href="#" id="' + mapStr + '-popup-closer" class="new-ol-popup-closer"></a>' +
                '<div id="' + mapStr + '-popup-content"></div>';
        targetDiv.appendChild(node);
        //自动获取地图div高度
        // this.autodivheight();
        //浏览器窗口发生变化时同时变化DIV高度
        // window.onresize = this.autodivheight;
        if (this.map) {//避免重复加载地图
          return;
        }
        //获取投影4490坐标系
        this.projection4490 = getProjection();
        //初始化地图信息
        this.map = new Map({
          target: targetMap.id,
          view: new View({
            center: this.center,
            maxZoom: 18,
            minZoom: 1,
            zoom: this.zoom,
            projection: 'EPSG:4490',
            resolutions: getResolutions()
          })
        });
        //添加天地图图层
        this.layer1 = new TileLayer({
          title: '天地图街道地图底图',
          source: new XYZ({
            crossOrigin: 'Anonymous', // 是否请求跨域操作
            url: 'http://t0.tianditu.gov.cn/vec_c/wmts?SERVICE=WMTS&REQUEST=GetTile&VERSION=1.0.0&LAYER=vec&STYLE=default&TILEMATRIXSET=c&FORMAT=tiles&TILEMATRIX={z}&TILEROW={y}&TILECOL={x}&tk=0bfd57475542d76f12578a701d2a70ab',
            projection: getProjection()
          })
        });
        this.map.addLayer(this.layer1);
        this.layer2 = new TileLayer({
          title: '天地图街道地图注记',
          source: new XYZ({
            crossOrigin: 'Anonymous', // 是否请求跨域操作
            url: 'http://t0.tianditu.gov.cn/cva_c/wmts?SERVICE=WMTS&REQUEST=GetTile&VERSION=1.0.0&LAYER=cva&STYLE=default&TILEMATRIXSET=c&FORMAT=tiles&TILEMATRIX={z}&TILEROW={y}&TILECOL={x}&tk=0bfd57475542d76f12578a701d2a70ab',
            projection: getProjection()
          })
        });
        this.map.addLayer(this.layer2);
        this.layer1.setZIndex(0);
        this.layer2.setZIndex(0);
        //矢量绘制图层
        this.source = new VectorSource({
          wrapX: false
        });
        let vectorLayer = new VectorLayer({
          source: that.source,
          projection: 'EPSG:4490'
        });
        this.map.addLayer(vectorLayer);
        vectorLayer.setZIndex(1);
        //测量结果图层
        this.measureSource = new VectorSource({
          wrapX: false
        });
        let measureLayer = new VectorLayer({
          source: that.measureSource,
          projection: 'EPSG:4490'
        });
        this.map.addLayer(measureLayer);
        measureLayer.setZIndex(1);

        //全部重大活动图层
        this.siteVectorLayer = new VectorLayer({
          source: new VectorSource({
            wrapX: false
          }),
          projection: 'EPSG:4490'
        });
        this.map.addLayer(this.siteVectorLayer);
        this.siteVectorLayer.setZIndex(4);

        //活动断层显示图层1
        this.hddcFeatureLayer1 = new VectorLayer({
          source: new VectorSource({
            wrapX: false
          }),
          projection: 'EPSG:4490'
        });
        this.map.addLayer(this.hddcFeatureLayer1);
        this.hddcFeatureLayer1.setZIndex(20);

        //活动断层显示图层2
        this.hddcFeatureLayer2 = new VectorLayer({
          source: new VectorSource({
            wrapX: false
          }),
          projection: 'EPSG:4490'
        });
        this.map.addLayer(this.hddcFeatureLayer2);
        this.hddcFeatureLayer2.setZIndex(20);

        //活动断层显示图层3
        this.hddcFeatureLayer3 = new VectorLayer({
          source: new VectorSource({
            wrapX: false
          }),
          projection: 'EPSG:4490'
        });
        this.map.addLayer(this.hddcFeatureLayer3);
        this.hddcFeatureLayer3.setZIndex(20);

        //活动断层显示图层4
        this.hddcFeatureLayer4 = new VectorLayer({
          source: new VectorSource({
            wrapX: false
          }),
          projection: 'EPSG:4490'
        });
        this.map.addLayer(this.hddcFeatureLayer4);
        this.hddcFeatureLayer4.setZIndex(20);

        //添加控件
        let info = new Control({ element: document.getElementById(mapStr + '-mapDiv') });
        info.setMap(this.map);
        this.map.addControl(info);
        //弹出窗口
        let popupTarget = document.getElementById(this.str + "-popup");
        if (popupTarget) {
          this.popupInfoLayer = new Overlay({
            element: popupTarget,
            positioning: 'center-center'
          });
          this.map.addOverlay(this.popupInfoLayer);
          //显示弹出窗口
          document.getElementById(this.str + "-popup").style.display = "block";
          //关闭弹出事件
          document.getElementById(this.str + "-popup-closer").onclick = function () {
            that.popupInfoLayer.setPosition(undefined);
            //隐藏弹出窗口
            document.getElementById(that.str + "-popup").style.display = "none";
          };
        }
        //右键菜单事件
        this.map.on('contextmenu', function (event) {
          event.preventDefault();//屏蔽自带的右键事件
          let pixel = that.map.getEventPixel(event.originalEvent);
          let feature = that.map.forEachFeatureAtPixel(pixel, function (feature) {
            //根据像素坐标获取右键选中的地图要素
            return feature;
          });
          if (feature && that.draw == null) {

          }
        });
        //点击地图事件
        this.map.on('click', function (event) {
          //隐藏右键菜单
          that.hideContextMenu();
          //隐藏弹出窗口
          if (that.popupInfoLayer != null) {
            that.popupInfoLayer.setPosition(undefined);
          }
          let pixel = that.map.getEventPixel(event.originalEvent);
          let coordinate = that.map.getEventCoordinate(event.originalEvent);
          //判断定位工具是否开启状态
          if (that.showHidePositionTool == false) {
            document.getElementById(mapStr + "-MousePositionLon").value = coordinate[0];
            document.getElementById(mapStr + "-MousePositionLat").value = coordinate[1];
          }
          let feature = that.map.forEachFeatureAtPixel(pixel, function (feature) {
            //根据像素坐标获取右键选中的地图要素
            return feature;
          });
          if (feature && that.draw == null) {
            //选中要素
            that.selectFeature = feature;
            //活动信息
            let temp = feature.getProperties();
            if (temp.iaId != undefined && temp.iaId != null) {//活动
              console.log("查看活动详情：" + temp.iaId);
              //查看相同行政区划代码的活动数据列表
              that.$emit("getDetailListByCode", temp.iaCode);
            }
          }
        });
        //地图移动事件
        this.map.on('moveend', function (event) {
          let center = that.map.getView().getCenter();
          let zoom = that.map.getView().getZoom();
          if (center[0] != that.center[0] || center[1] != that.center[1] || zoom != that.zoom) {
            //设置主界面图标文字
            that.zoomDefaultPositionBool = false;
          } else {//主界面
            //设置主界面图标文字
            that.zoomDefaultPositionBool = true;
          }
        });
        //鼠标移动事件--测量工具
        this.map.on('pointermove', function (evt) {
          if (evt.dragging) {
            return;
          }
          if (that.measure != null) {
            let helpMsg = '点击开始绘制';
            if (that.sketch) {
              const geom = that.sketch.getGeometry();
              if (geom instanceof Polygon) {
                helpMsg = '点击继续绘制多边形';
              } else if (geom instanceof LineString) {
                helpMsg = '点击继续绘制折线';
              }
            }

            that.helpTooltipElement.innerHTML = helpMsg;
            that.helpTooltip.setPosition(evt.coordinate);
            that.helpTooltipElement.classList.remove('hidden');
          }
        });
        //鼠标移出事件--测量工具
        this.map.getViewport().addEventListener('mouseout', function () {
          if (that.measure != null) {
            that.helpTooltipElement.classList.add('hidden');
          }
        });
        //地址匹配
        //this.addressMatchService = new AddressMatchService(this.addressUrl);
        //地图缩放到权限位置
        this.zoomDefaultPosition();
      },
      autodivheight() {//自动获取div高度
        //获取浏览器窗口高度
        let winHeight = 0;
        if (window.innerHeight) {
          winHeight = window.innerHeight;
        } else if ((document.body) && (document.body.clientHeight)) {
          winHeight = document.body.clientHeight;
        }
        //通过深入Document内部对body进行检测，获取浏览器窗口高度
        if (document.documentElement && document.documentElement.clientHeight) {
          winHeight = document.documentElement.clientHeight;
        }
        //全屏时窗口高度:864px,地图div高度:658px
        let tempHeight = 864;
        //let mapTempHeight = 658;
        let mapTempHeight = 710;
        let mapHeight = winHeight - tempHeight + mapTempHeight;
        //最小高度
        if (mapHeight < 480) {
          mapHeight = 480;
        }
        //设置地图高度
        document.getElementById(this.str + "-map").style.height = mapHeight + "px";
        //resize事件--刷新地图,确保地图不变形
        if (this.map) {
          this.map.updateSize();
        }
      },
      setPopupContent(temp) {//设置弹窗内容
        let html = "";
        //主键
        let iaId = temp.iaId;
        //活动ID
        let iaNumber = temp.iaNumber;
        //活动名称
        let iaName = temp.iaName;
        //所属省份
        let iaProvince = temp.iaProvince;
        //城市名称
        let iaCity = temp.iaCity;
        //区县名称
        let iaCounties = temp.iaCounties;
        //行政代码
        let iaCode = temp.iaCode;
        //起始时间
        let iaStartingTime = temp.iaStartingTime;
        //终止时间
        let iaFinshTime = temp.iaFinshTime;
        //弹窗内容
        html += "活动ID：" + iaNumber + "<br/>" + "活动名称：" + iaName + "<br/>"
                + "起始时间：" + iaStartingTime + "<br/>" + "终止时间：" + iaFinshTime + "<br/>";

        document.getElementById(this.str + '-popup-content').innerHTML = html;
        //显示弹出窗口
        document.getElementById(this.str + "-popup").style.display = "block";
      },
      getTextFormat(str) {//格式化文本内容
        if (str == null || str == undefined) {
          str = "";
        }
        return str;
      },
      hideContextMenu() {//隐藏右键菜单
        //隐藏右键菜单

      },
      //切换地图
      switchMap() {
        if (this.switchMapBool) {//显示街道图
          this.switchMapBool = false;
          //添加天地图图层
          if (this.layer1 == null) {
            this.layer1 = new TileLayer({
              title: '天地图街道地图底图',
              source: new XYZ({
                crossOrigin: 'Anonymous', // 是否请求跨域操作
                url: 'http://t0.tianditu.gov.cn/vec_c/wmts?SERVICE=WMTS&REQUEST=GetTile&VERSION=1.0.0&LAYER=vec&STYLE=default&TILEMATRIXSET=c&FORMAT=tiles&TILEMATRIX={z}&TILEROW={y}&TILECOL={x}&tk=0bfd57475542d76f12578a701d2a70ab',
                projection: "EPSG:4490"
              })
            });
            this.map.addLayer(this.layer1);
          }
          if (this.layer2 == null) {
            this.layer2 = new TileLayer({
              title: '天地图街道地图注记',
              source: new XYZ({
                crossOrigin: 'Anonymous', // 是否请求跨域操作
                url: 'http://t0.tianditu.gov.cn/cva_c/wmts?SERVICE=WMTS&REQUEST=GetTile&VERSION=1.0.0&LAYER=cva&STYLE=default&TILEMATRIXSET=c&FORMAT=tiles&TILEMATRIX={z}&TILEROW={y}&TILECOL={x}&tk=0bfd57475542d76f12578a701d2a70ab',
                projection: "EPSG:4490"
              })
            });
            this.map.addLayer(this.layer2);
          }
          //显示街道图
          this.layer1.setVisible(true);
          this.layer2.setVisible(true);
          this.layer3.setVisible(false);
          this.layer4.setVisible(false);
          this.layer1.setZIndex(0);
          this.layer2.setZIndex(0);
        } else {//显示卫星图
          this.switchMapBool = true;
          if (this.layer3 == null) {
            this.layer3 = new TileLayer({
              title: '天地图卫星影像',
              source: new XYZ({
                crossOrigin: 'Anonymous', // 是否请求跨域操作
                url: 'http://t0.tianditu.gov.cn/img_c/wmts?SERVICE=WMTS&REQUEST=GetTile&VERSION=1.0.0&LAYER=img&STYLE=default&TILEMATRIXSET=c&FORMAT=tiles&TILEMATRIX={z}&TILEROW={y}&TILECOL={x}&tk=0bfd57475542d76f12578a701d2a70ab',
                projection: "EPSG:4490"
              })
            });
            this.map.addLayer(this.layer3);
          }
          if (this.layer4 == null) {
            this.layer4 = new TileLayer({
              title: '天地图卫星影像',
              source: new XYZ({
                crossOrigin: 'Anonymous', // 是否请求跨域操作
                url: 'http://t0.tianditu.gov.cn/cia_c/wmts?SERVICE=WMTS&REQUEST=GetTile&VERSION=1.0.0&LAYER=cia&STYLE=default&TILEMATRIXSET=c&FORMAT=tiles&TILEMATRIX={z}&TILEROW={y}&TILECOL={x}&tk=0bfd57475542d76f12578a701d2a70ab',
                projection: "EPSG:4490"
              })
            });
            this.map.addLayer(this.layer4);
          }
          //显示卫星图
          this.layer1.setVisible(false);
          this.layer2.setVisible(false);
          this.layer3.setVisible(true);
          this.layer4.setVisible(true);
          this.layer3.setZIndex(0);
          this.layer4.setZIndex(0);
        }
      },
      //地图缩放到权限位置
      zoomDefaultPosition() {
        //刷新地图,确保地图不变形
        this.map.updateSize();
        this.map.getView().setCenter(this.center);
        this.map.getView().setZoom(this.zoom);
        this.zoomDefaultPositionBool = true;
      },
      //显示工具箱
      showHideToolsBoxDiv() {
        if (this.showHideToolsBox) {
          this.showHideToolsBox = false;
          document.getElementById(this.str + "-ToolsBoxDiv").style.display = "block";
        } else {
          this.showHideToolsBox = true;
          document.getElementById(this.str + "-ToolsBoxDiv").style.display = "none";
        }
        //关闭全部工具
        this.closeAllToolsBox(null);
      },
      //关闭全部工具
      closeAllToolsBox(type) {
        //关闭测量工具
        if (type != "MeasureTool" && this.showHideMeasureTool == false) {
          this.showHideMeasureTool = true;
          let divId = this.str + "-MeasureToolsDiv";
          //隐藏
          document.getElementById(divId).style.display = "none";
          //清空测量结果
          this.clearMeasure();
          this.clearMeasureBool = true;
        }
        //关闭定位工具
        if (type != "PositionTool" && this.showHidePositionTool == false) {
          this.showHidePositionTool = true;
          let divId = this.str + "-MousePositionDiv";
          //隐藏
          document.getElementById(divId).style.display = "none";
          //清空定位结果
          this.clearPosition();
        }
      },
      measureToolBox() {//测量工具Div
        let divId = this.str + "-MeasureToolsDiv";
        //关闭全部工具
        this.closeAllToolsBox("MeasureTool");
        if (this.showHideMeasureTool) {
          this.showHideMeasureTool = false;
          //显示
          document.getElementById(divId).style.display = "block";
        } else {
          this.showHideMeasureTool = true;
          //隐藏
          document.getElementById(divId).style.display = "none";
        }
      },
      measureDistance() {//测距
        if (this.source != null) {
          //地图工具箱--开启测距
          this.setMapToolBox('MeasureDistance');
          //设置样式
          this.measureDistanceBool = false;
          this.measureAreaBool = true;
          this.stopMeasureBool = true;
          this.clearMeasureBool = true;
        }
      },
      measureArea() {//测面
        if (this.source != null) {
          //地图工具箱--开启测面
          this.setMapToolBox('MeasureArea');
          //设置样式
          this.measureAreaBool = false;
          this.measureDistanceBool = true;
          this.stopMeasureBool = true;
          this.clearMeasureBool = true;
        }
      },
      stopMeasure() {//停止测量
        if (this.source != null) {
          //地图工具箱--停止测量
          this.setMapToolBox('StopMeasure');
          //设置样式
          this.stopMeasureBool = false;
          this.measureDistanceBool = true;
          this.measureAreaBool = true;
          this.clearMeasureBool = true;
        }
      },
      clearMeasure() {//清空测量结果
        if (this.source != null) {
          //地图工具箱--清空测量结果
          this.setMapToolBox('ClearMeasure');
          //设置样式
          this.clearMeasureBool = false;
          this.measureDistanceBool = true;
          this.measureAreaBool = true;
          this.stopMeasureBool = true;
        }
      },
      positionToolBox() {//定位工具Div
        let divId = this.str + "-MousePositionDiv";
        //关闭全部工具
        this.closeAllToolsBox("PositionTool");
        if (this.showHidePositionTool) {
          this.showHidePositionTool = false;
          //显示
          document.getElementById(divId).style.display = "block";
        } else {
          this.showHidePositionTool = true;
          //隐藏
          document.getElementById(divId).style.display = "none";
        }
      },
      addPosition() {//添加定位结果
        this.clearPositionBool = true;
        this.addPositionBool = false;
        //添加定位结果
        if (this.source != null) {
          let longitude = document.getElementById(this.str + "-MousePositionLon").value;
          let latitude = document.getElementById(this.str + "-MousePositionLat").value;
          //处理经纬度
          let lonlat = this.getLonLat(longitude, latitude);
          if (lonlat != null) {
            //点
            let featureTmp = new Feature({
              geometry: new Point(lonlat)
            });
            //样式
            let style = this.getPointStyle();
            featureTmp.setStyle(style);
            //设置属性
            featureTmp.setProperties({
              type: "position",
              longitude: longitude,
              latitude: latitude,
            });
            //添加定位点
            this.source.addFeature(featureTmp);
            //居中缩放
            this.map.getView().setCenter(lonlat);
            this.map.getView().setZoom(12);
          }
        }
      },
      clearPosition() {//清空定位结果
        this.clearPositionBool = false;
        this.addPositionBool = true;
        //地图工具箱--清空
        this.setMapToolBox("Clear");
      },
      //地图工具箱
      setMapToolBox(value) {
        let that = this;
        if (value === 'Clear') {//清空
          //清空
          that.source.clear();
          //停止绘制|修改|拖拽|选择
          clearInteraction();
        } else if (value === 'Point' || value === 'LineString' || value === 'Polygon' || value === 'Circle') {//开启绘制
          //点|线|面|圆绘制
          //开启绘制
          startDrawInteraction(value, false);
        } else if (value === 'FreeHandLineString' || value === 'FreeHandPolygon') {//开启绘制
          //手绘线|手绘面
          value = value.split("FreeHand")[1];
          //开启绘制
          startDrawInteraction(value, true);
        } else if (value === 'StopDraw') {//停止绘制
          //停止绘制
          stopDrawInteraction();
        } else if (value === 'Snap') {//开启捕捉
          //开启捕捉
          startSnapInteraction();
        } else if (value === 'NotSnap') {//停止捕捉
          //停止捕捉
          stopSnapInteraction();
        } else if (value === 'Modify') {//开启修改
          //开启修改
          startModifyInteraction();
        } else if (value === 'NotModify') {//停止修改
          //停止修改
          stopModifyInteraction();
          //停止选择
          stopSelectInteraction();
        } else if (value === 'Drag') {//开启拖拽
          //开启拖拽
          startDragInteraction();
        } else if (value === 'NotDrag') {//停止拖拽
          //停止拖拽
          stopDragInteraction();
        } else if (value === 'Select') {//开启选择
          //开启选择
          startSelectInteraction();
        } else if (value === 'NotSelect') {//停止选择
          //停止选择
          stopSelectInteraction();
        } else if (value === 'MeasureDistance') {//开启测距
          //开启测距
          startMeasureInteraction('LineString');
        } else if (value === 'MeasureArea') {//开启测面
          //开启测面
          startMeasureInteraction('Polygon');
        } else if (value === 'StopMeasure') {//停止测量（测距|测面）
          //停止测量
          stopMeasureInteraction();
        } else if (value === 'ClearMeasure') {//清空测量结果
          //停止测量
          stopMeasureInteraction();
          //清空测量结果
          clearMeasureResult();
        }

        //停止绘制|修改|拖拽|选择
        function clearInteraction() {
          //停止拖拽
          stopDragInteraction();
          //停止修改
          stopModifyInteraction();
          //停止选择
          stopSelectInteraction();
          //停止绘制
          stopDrawInteraction();
        }

        //停止捕捉
        function stopSnapInteraction() {
          if (that.snap) {
            that.map.removeInteraction(that.snap);
            that.snap = null;
          }
        }

        //开启捕捉
        function startSnapInteraction() {
          //停止捕捉
          stopSnapInteraction();
          //开启捕捉
          that.snap = new Snap({
            source: that.source
          });
          that.map.addInteraction(that.snap);
        }

        //停止拖拽
        function stopDragInteraction() {
          //停止拖拽
          if (that.drag) {
            that.map.removeInteraction(that.drag);
            that.drag = null;
          }
        }

        //开启拖拽
        function startDragInteraction() {
          //停止绘制
          stopDrawInteraction();
          //停止修改
          stopModifyInteraction();
          //开启选择
          startSelectInteraction();
          //停止拖拽
          stopDragInteraction();
          //开启拖拽
          that.drag = new Translate({
            features: that.select.getFeatures()
          });
          that.map.addInteraction(that.drag);
        }

        //停止修改
        function stopModifyInteraction() {
          //停止修改
          if (that.modify) {
            that.map.removeInteraction(that.modify);
            that.modify = null;
          }
        }

        //开启修改
        function startModifyInteraction() {
          //停止绘制
          stopDrawInteraction();
          //开启选择
          startSelectInteraction();
          //停止修改
          stopModifyInteraction();
          //开启修改
          that.modify = new Modify({
            features: that.select.getFeatures()
          });
          that.map.addInteraction(that.modify);
        }

        //停止选择
        function stopSelectInteraction() {
          //停止选择
          if (that.select) {
            that.map.removeInteraction(that.select);
            that.select = null;
          }
        }

        //开启选择
        function startSelectInteraction() {
          //停止选择
          stopSelectInteraction();
          //开启选择
          that.select = new Select({
            wrapX: false
          });
          that.map.addInteraction(that.select);
        }

        //停止绘制
        function stopDrawInteraction() {
          //停止绘制
          if (that.draw) {
            that.map.removeInteraction(that.draw);
            that.draw = null;
          }
        }

        //开启绘制
        function startDrawInteraction(type, bool) {
          //停止拖拽
          stopDragInteraction();
          //停止修改
          stopModifyInteraction();
          //停止选择
          stopSelectInteraction();
          //停止绘制
          stopDrawInteraction();
          if (bool) {//手绘线|手绘面
            that.draw = new Draw({
              source: that.source,
              type: type,
              snapTolerance: 20,
              freehand: true
            });
            that.map.addInteraction(that.draw);
          } else {//点|线|面|圆绘制
            that.draw = new Draw({
              source: that.source,
              type: type,
              snapTolerance: 20
            });
            that.map.addInteraction(that.draw);
          }
        }

        //计算面积
        function getPolygonArea(polygon) {
          // 这里一定要给坐标，和地图坐标保持一致，否则面积不准
          const area = getArea(polygon, { projection: 'EPSG:4490' })
          let output = Math.round((area / 1000000) * 100) / 100;//平方公里
          return output;
        }

        ////////////////////////////////////////////////////////////////////测量工具箱
        //格式化距离
        function formatLength(line) {
          const length = getLength(line, { projection: 'EPSG:4490' });
          let output;
          if (length > 100) {
            output = Math.round((length / 1000) * 100) / 100 + ' ' + 'km';
          } else {
            output = Math.round(length * 100) / 100 + ' ' + 'm';
          }
          return output;
        }

        //格式化面积
        function formatArea(polygon) {
          const area = getArea(polygon, { projection: 'EPSG:4490' });
          let output;
          if (area > 10000) {
            output = Math.round((area / 1000000) * 100) / 100 + ' ' + 'km<sup>2</sup>';
          } else {
            output = Math.round(area * 100) / 100 + ' ' + 'm<sup>2</sup>';
          }
          return output;
        }

        //创建新的提示tip
        function createHelpTooltip() {
          if (that.helpTooltipElement != null) {
            that.helpTooltipElement.parentNode.removeChild(that.helpTooltipElement);
          }
          that.helpTooltipElement = document.createElement('div');
          that.helpTooltipElement.className = 'ol-tooltip hidden';
          that.helpTooltip = new Overlay({
            element: that.helpTooltipElement,
            offset: [15, 0],
            positioning: 'center-left',
          });
          that.map.addOverlay(that.helpTooltip);
        }

        //创建新的测量提示
        function createMeasureTooltip() {
          if (that.measureTooltipElement != null) {
            that.measureTooltipElement.parentNode.removeChild(that.measureTooltipElement);
          }
          that.measureTooltipElement = document.createElement('div');
          that.measureTooltipElement.className = 'ol-tooltip ol-tooltip-measure';
          that.measureTooltip = new Overlay({
            element: that.measureTooltipElement,
            offset: [0, -15],
            positioning: 'bottom-center',
            stopEvent: false,
            insertFirst: false,
          });
          that.map.addOverlay(that.measureTooltip);
        }

        //开启测量工具
        function startMeasureInteraction(type) {
          //停止测量工具
          stopMeasureInteraction();

          console.log(type);
          //开启测量工具--绘制
          that.measure = new Draw({
            source: that.measureSource,
            type: type,
            style: new Style({
              fill: new Fill({
                color: 'rgba(255, 255, 255, 0.2)',
              }),
              stroke: new Stroke({
                color: 'rgba(0, 0, 0, 0.5)',
                lineDash: [10, 10],
                width: 2,
              }),
              image: new Circle({
                radius: 5,
                stroke: new Stroke({
                  color: 'rgba(0, 0, 0, 0.7)',
                }),
                fill: new Fill({
                  color: 'rgba(255, 255, 255, 0.2)',
                }),
              }),
            }),
          });
          that.map.addInteraction(that.measure);

          //创建新的测量提示
          createMeasureTooltip();
          //创建新的提示tip
          createHelpTooltip();

          let listener;
          that.measure.on('drawstart', function (evt) {
            //设置sketch
            that.sketch = evt.feature;

            let tooltipCoord = evt.coordinate;

            listener = that.sketch.getGeometry().on('change', function (evt) {
              const geom = evt.target;
              let output;
              if (geom instanceof Polygon) {
                output = formatArea(geom);
                tooltipCoord = geom.getInteriorPoint().getCoordinates();
              } else if (geom instanceof LineString) {
                output = formatLength(geom);
                tooltipCoord = geom.getLastCoordinate();
              }
              that.measureTooltipElement.innerHTML = output;
              that.measureTooltip.setPosition(tooltipCoord);
            });
          });
          //完成测量绘制
          that.measure.on('drawend', function () {
            that.measureTooltipElement.className = 'ol-tooltip ol-tooltip-static';
            that.measureTooltip.setOffset([0, -7]);
            //添加到数组
            that.measureTooltipArray.push(that.helpTooltip);
            //添加到数组
            that.measureTooltipArray.push(that.measureTooltip);
            //清空sketch
            that.sketch = null;
            //清空tooltip
            that.measureTooltipElement = null;
            createMeasureTooltip();
            unByKey(listener);
          });
        }

        //停止测量工具
        function stopMeasureInteraction() {
          //停止绘制
          stopDrawInteraction();
          //停止测量工具
          if (that.measure) {
            that.map.removeInteraction(that.measure);
            that.measure = null;
            //隐藏提示tip
            that.helpTooltipElement.classList.add('hidden');
            //移除测量提示
            if (that.helpTooltip != null) {
              that.map.removeOverlay(that.helpTooltip);
            }
            if (that.measureTooltip != null) {
              that.map.removeOverlay(that.measureTooltip);
            }
          }
        }

        //清空测量结果
        function clearMeasureResult() {
          if (that.measureSource != null) {
            //清空测量结果
            that.measureSource.clear();
            //清空测量结果提示数组
            if (that.measureTooltipArray.length > 0) {
              for (let i = 0; i < that.measureTooltipArray.length; i++) {
                that.map.removeOverlay(that.measureTooltipArray[i]);
              }
              that.measureTooltipArray = [];
            }
          }
        }
      },
      getPolyonStyle(color) {//多边形样式
        let style = new Style({
          fill: new Fill({//填充样式
            color: "rgba(0,0,0,0)"
          }),
          stroke: new Stroke({//描绘
            width: 2,//宽
            color: color
          })
        });

        return style;
      },
      getPointStyle() {//点图标样式
        let style = new Style({
          image: new Icon({
            src: dingweiImg,
            anchor: [0.5, 1]
          }),
        });

        return style;
      },
      //处理经纬度
      getLonLat(longitude, latitude) {
        let lonlat = null;
        if (longitude != null && latitude != null && longitude != "" && latitude != "") {
          let lon = Number(longitude);
          let lat = Number(latitude);
          if (lon > 0 && lon < 180 && lat > 0 && lat < 90) {
            lonlat = [lon, lat];
          }
        }

        return lonlat;
      },
      //地图显示全部查询结果
      showAllListData(){
        let allDataList = this.allDataList;
        if(allDataList!=null && allDataList.length==5){
          let radioLabel = allDataList[0];
          let versionCode = allDataList[1];
          let resultList = allDataList[2];
          let bool = allDataList[3];//添加、移除版本号图层
          //根据图层序号和版本号设置图层数组并获取当前版本号图层
          let selectLayer = this.setBaseVectorLayer(radioLabel,versionCode,bool);
          if(selectLayer!=null){
            if(resultList!=null && resultList.length>0){
              //获取三级数据类别（数据表）code
              let typeCode = this.getDictItemCode(radioLabel);
              this.showDataList(typeCode,selectLayer,versionCode,resultList);//显示查询图层数据
            }else{
              //清空图层上的所有要素
              //selectLayer.getSource().clear();
            }
          }
          //超图图层
          //根据图层序号和版本号设置超图图层数组并获取当前版本号图层
          let selectRestLayer = this.setRestVectorLayer(radioLabel,versionCode,bool);
          if(selectRestLayer!=null){
            let params = {
              radioLabel:radioLabel,
              versionCode:versionCode,
              show:bool,
              sqlText:selectRestLayer.sqlText
              // sqlText:""
            }
            //根据查询图层信息参数查询并显示图层
            this.queryLayersByParams(params);
          }
        }
      },
      //根据查询图层信息参数查询并显示图层
      queryLayersByParams(params){
        if(params.radioLabel && params.radioLabel!=="" && params.versionCode && params.versionCode!==""){
          //清空全部选择图层要素
          this.clearAllSelectionLayer();
          for(let i=0;i<this.allRestVectorLayerArray.length;i++){
            for(let j=0;j<this.allRestVectorLayerArray[i].length;j++){
              if(this.allRestVectorLayerArray[i][j].radioLabel===params.radioLabel && this.allRestVectorLayerArray[i][j].versionCode===params.versionCode){
                if(this.allRestVectorLayerArray[i][j].vectorTileLayer!=null){//REST矢量切片图层
                  //移除图层
                  this.map.removeLayer(this.allRestVectorLayerArray[i][j].vectorTileLayer);
                  this.allRestVectorLayerArray[i][j].vectorTileLayer = null;
                  this.allRestVectorLayerArray[i][j].vectorTileStyles = null;
                }
                if(this.allRestVectorLayerArray[i][j].restTileLayer!=null){//REST瓦片图层
                  //移除图层
                  this.map.removeLayer(this.allRestVectorLayerArray[i][j].restTileLayer);
                  this.allRestVectorLayerArray[i][j].restTileLayer = null;
                }
                //地图服务
                //获取数据类型信息
                let dataTypeInfo = this.getDataTypeInfo(params.radioLabel,"radioLabel");
                let url = dataTypeInfo.url;
                //test
                //url = "http://10.13.155.192:8090/iserver/services/map-fxfzypg/rest/maps/district_boundary_province@fxfzypg";

                if(dataTypeInfo.database=="arcgis"){
                  //清空Arcgis服务活动断层
                  this.clearArcgisHddcLayer(dataTypeInfo.sqlFilter);
                }

                if(params.show) {//显示图层
                  if(dataTypeInfo.database=="arcgis"){
                    //显示Arcgis服务活动断层
                    //this.showArcgisHddcLayer(dataTypeInfo.sqlFilter);
                    continue;
                  }

                  let zIndex = dataTypeInfo.zIndex;
                  let sqlText = params.sqlText;
                  if(sqlText && sqlText!==""){//根据sql条件显示临时图层
                    let layerID = this.allRestVectorLayerArray[i][j].tempLayerId;//临时图层ID
                    if(layerID!=null && layerID!=="") {//指定临时图层ID
                      //更新超图临时图层信息
                      this.getPutTempLayersSet(i,j,url,layerID,zIndex,sqlText);
                    }else{
                      this.createRestMapTempLayersSet(i,j,url,zIndex,sqlText);//查询REST图层信息并创建新的临时图层
                    }
                    //根据url和zIndex、sqlText添加矢量切片图层
                    // this.createVectorTileLayer(i,j,url,zIndex,sqlText);
                  }else{//显示整个图层
                    // this.deleteRestMapTempLayersSet(url,null);//删除超图临时图层
                    // url = "http://10.13.155.192:8090/iserver/services/map-fxfzypg/rest/maps/district_boundary_china@fxfzypg";
                    //根据url、临时图层layerID和zIndex添加瓦片地图图层REST
                    this.createMapRestLayer(i,j,url,'',zIndex);
                    //根据url和zIndex添加矢量切片图层
                    // this.createVectorTileLayer(i,j,url,zIndex,null);
                  }
                }else{//隐藏图层
                  //
                }
                break;
              }
            }
          }
        }
      },
      //批量查询全球Arcgis服务活动断层
      showArcgisHddcLayer(sqlFilter){
        let xMin = -180;
        let xMax = xMin + 6;
        let yMin = -90;
        let yMax = 90;
        for(let i=0;i<60;i++){
          //转换为3857坐标
          let minLonLat = this.getTransformLonLat3857([xMin,yMin]);
          let maxLonLat = this.getTransformLonLat3857([xMax,yMax]);
          //根据范围查询Arcgis服务活动断层
          this.showArcgisHddcLayerByBound(sqlFilter,minLonLat[0],maxLonLat[0],minLonLat[1],maxLonLat[1]);
          xMin = xMax;
          xMax = xMax + 6;
        }
      },
      //根据范围查询Arcgis服务活动断层
      showArcgisHddcLayerByBound(sqlFilter,xMin,xMax,yMin,yMax){
        let that = this;
        let token = this.ArcGIStoken;
        let arcgisUrl = this.ArcGISurl;
        let url = encodeURI(arcgisUrl+"/全国断层服务器发布图层/MapServer/0/query?f=json&geometry={\"spatialReference\":{\"latestWkid\":3857,\"wkid\":102100},\"xmin\":"+xMin+",\"ymin\":"+yMin+",\"xmax\":"+xMax+",\"ymax\":"+yMax+"}&maxAllowableOffset=9783.939620500008&maxRecordCountFactor=3&outFields=FID,活动时代&outSR=102100&resultType=tile&returnExceededLimitFeatures=false&spatialRel=esriSpatialRelIntersects&where=(活动时代 like '%"+sqlFilter+"%')&geometryType=esriGeometryEnvelope&inSR=102100&token="+token);
        // let url = encodeURI("https://www.activefault-datacenter.cn/arcgis/rest/services/全国断层服务器发布图层/MapServer/0/query?f=json&geometry={\"spatialReference\":{\"latestWkid\":3857,\"wkid\":102100},\"xmin\":12523442.714237027,\"ymin\":2504688.542850986,\"xmax\":15028131.257085029,\"ymax\":5009377.085698988}&maxAllowableOffset=9783.939620500008&maxRecordCountFactor=3&outFields=FID,活动时代&outSR=102100&resultType=tile&returnExceededLimitFeatures=false&spatialRel=esriSpatialRelIntersects&where=(活动时代 like '%"+sqlFilter+"%')&geometryType=esriGeometryEnvelope&inSR=102100&token=ntIRbGMjVNPklAVuo3pHEd4A-F2NI-Tn8MJ74e7ha3IkucwalF6jHekR7BbuML0jQQSuL39z7zQUzzHEtJBOHg..");
        //图层图例信息查询
        let httpRequest = new XMLHttpRequest();//第一步：建立所需的对象
        httpRequest.open('GET', url, true);//第二步：打开连接  将请求参数写在url中  ps:"http://localhost:8080/rest/xxx"
        httpRequest.send();//第三步：发送请求  将请求参数写在URL中
        /**
         * 获取数据后的处理程序
         */
        httpRequest.onreadystatechange = function () {
          if (httpRequest.readyState == 4 && httpRequest.status == 200) {
            let json = httpRequest.responseText;//获取到json字符串，还需解析
            let obj = JSON.parse(json);
            let features = obj.features;
            if(features && features.length>0) {
              for(let i=0;i<features.length;i++){
                let FID = features[i].attributes.FID;
                let paths = features[i].geometry.paths[0];
                let lonlatArr = [];
                for(let j=0;j<paths.length;j++){
                  let lonlat = that.getTransformLonLat4326(paths[j]);
                  if(lonlat){
                    lonlatArr.push(lonlat);
                  }
                }
                let featureTmp = new Feature({
                  geometry:new LineString(lonlatArr)
                });
                if(sqlFilter=="全新世断层"){
                  //样式
                  let style = that.getLineStringStyle("#ff2525");
                  featureTmp.setStyle(style);
                  that.hddcFeatureLayer1.getSource().addFeature(featureTmp);
                }else if(sqlFilter=="晚更新世断层"){
                  //样式
                  let style = that.getLineStringStyle("#c922ff");
                  featureTmp.setStyle(style);
                  that.hddcFeatureLayer2.getSource().addFeature(featureTmp);
                }else if(sqlFilter=="早中更新世断层"){
                  //样式
                  let style = that.getLineStringStyle("#5ab53c");
                  featureTmp.setStyle(style);
                  that.hddcFeatureLayer3.getSource().addFeature(featureTmp);
                }else if(sqlFilter=="前第四纪断层"){
                  //样式
                  let style = that.getLineStringStyle("#2d2d2d");
                  featureTmp.setStyle(style);
                  that.hddcFeatureLayer4.getSource().addFeature(featureTmp);
                }
              }
            }
          }
        };
      },
      getTransformLonLat4326(lonlat){//转换为4326坐标
        let resultLonLat = null;
        if(lonlat!=null && lonlat.length==2){
          let sourceProj = 'EPSG:3857'; // 原始坐标系为墨卡托投影
          let destProj = 'EPSG:4326'; // 目标坐标系为经纬度
          resultLonLat = transform(lonlat, sourceProj, destProj);//坐标转换
        }
        return resultLonLat;
      },
      getTransformLonLat3857(lonlat){//转换为3857坐标
        let resultLonLat = null;
        if(lonlat!=null && lonlat.length==2){
          let sourceProj = 'EPSG:4326'; // 原始坐标系为经纬度
          let destProj = 'EPSG:3857'; // 目标坐标系为墨卡托投影
          resultLonLat = transform(lonlat, sourceProj, destProj);//坐标转换
        }
        return resultLonLat;
      },
      //获取数据类型信息
      getDataTypeInfo(value,type){
        let dataTypeInfo = null;
        if(value && type && this.allDataTypeInfoArray!=null && this.allDataTypeInfoArray.length>0){
          for(let i=0;i<this.allDataTypeInfoArray.length;i++){
            if(this.allDataTypeInfoArray[i][type]===value){
              dataTypeInfo = this.allDataTypeInfoArray[i];
              break;
            }
          }
        }

        return dataTypeInfo;
      },
      //清空全部选择图层要素
      clearAllSelectionLayer(){
        if(this.selectLayerIndex && this.selectLayerIndex.length==2){
          let iIndex = this.selectLayerIndex[0];
          let jIndex = this.selectLayerIndex[1];
          if(iIndex && jIndex && this.allRestVectorLayerArray[iIndex][jIndex].vectorTileLayer){
            //矢量切片样式
            if(this.allRestVectorLayerArray[iIndex][jIndex].vectorTileStyles){
              this.allRestVectorLayerArray[iIndex][jIndex].vectorTileStyles.featureSelectedFunction({
                selectedId: null,
                layerName: null,
                fieldId:null
              });
              if(this.allRestVectorLayerArray[iIndex][jIndex].vectorTileLayer){
                this.allRestVectorLayerArray[iIndex][jIndex].vectorTileLayer.changed();
              }
            }
          }
        }
      },
      //根据图层序号获取图层数组序号
      getRestLayerIndex(radioLabel){
        let index = null;
        if(radioLabel && this.allRestVectorLayerArray!=null && this.allRestVectorLayerArray.length>0) {
          for(let i=0;i<this.allRestVectorLayerArray.length;i++){
            if(this.allRadioIndexList[i]==radioLabel){
              index = i;
              break;
            }
          }
        }

        return index;
      },
      //根据图层序号和版本号获取图层序号
      getRestVectorLayerIndexArray(radioLabel,versionCode){
        let indexArray = [];
        if(radioLabel && versionCode && this.allRestVectorLayerArray!=null && this.allRestVectorLayerArray.length>0) {
          for(let i=0;i<this.allRestVectorLayerArray.length;i++){
            if(this.allRadioIndexList[i]==radioLabel){
              for(let j=0;j<this.allRestVectorLayerArray[i].length;j++){
                if(this.allRestVectorLayerArray[i][j].versionCode==versionCode){
                  indexArray = [i,j];
                }
              }
              break;
            }
          }
        }

        return indexArray;
      },
      //根据图层序号和版本号设置超图图层数组
      setRestVectorLayer(radioLabel,versionCode,bool){
        let selectLayer = null;
        //根据图层序号获取图层数组序号
        let iIndex = this.getRestLayerIndex(radioLabel);
        //根据图层序号和版本号获取图层序号
        let indexArray = this.getRestVectorLayerIndexArray(radioLabel,versionCode);
        let jIndex = null;
        if(indexArray!=null && indexArray.length==2){
          iIndex = indexArray[0];
          jIndex = indexArray[1];
          selectLayer = this.allRestVectorLayerArray[iIndex][jIndex];
        }
        if(bool){//添加超图图层
          if(selectLayer!=null){
            return selectLayer;
          }
          //创建超图图层
          if(radioLabel && this.typeCodeDataArray!=null && this.typeCodeDataArray.length>0){
            for(let i=0;i<this.typeCodeDataArray.length;i++){
              if(this.typeCodeDataArray[i].radioLabel==radioLabel){
                let code = this.typeCodeDataArray[i].dictItemCode;
                let name = this.typeCodeDataArray[i].name;
                // let sqlText = "data_version like '%"+versionCode+"%'";//查询临时图层
                let sqlText = this.typeCodeDataArray[i].sqlFilter;//sql过滤条件
                selectLayer = {
                  code:code,//图层类型code
                  name:name,//图层名称
                  vectorTileLayer:null,//REST矢量切片图层
                  restTileLayer:null,//REST瓦片图层
                  sqlText:sqlText,//查询条件
                  tempLayerId:null,//临时图层ID
                  vectorTileStyles:null,//矢量切片样式
                  versionCode:versionCode,//版本号
                  radioLabel: radioLabel,//字典序号
                };
                break;
              }
            }
          }
          //添加超图图层数组
          this.allRestVectorLayerArray[iIndex].push(selectLayer);
        }else{//移除超图图层
          //根据版本号清除超图图层要素
          this.removeRestLayerDataByTypeCode(iIndex,jIndex);
          //清空活动断层图层
          if(iIndex==0){
            //清空Arcgis服务活动断层
            this.clearArcgisHddcLayer("全新世断层");
          }else if(iIndex==1){
            //清空Arcgis服务活动断层
            this.clearArcgisHddcLayer("晚更新世断层");
          }else if(iIndex==2){
            //清空Arcgis服务活动断层
            this.clearArcgisHddcLayer("早中更新世断层");
          }else if(iIndex==3){
            //清空Arcgis服务活动断层
            this.clearArcgisHddcLayer("前第四纪断层");
          }
        }

        return selectLayer;
      },
      //清空Arcgis服务活动断层
      clearArcgisHddcLayer(sqlFilter){
        if(sqlFilter=="全新世断层"){
          this.hddcFeatureLayer1.getSource().clear();
        }else if(sqlFilter=="晚更新世断层"){
          this.hddcFeatureLayer2.getSource().clear();
        }else if(sqlFilter=="早中更新世断层"){
          this.hddcFeatureLayer3.getSource().clear();
        }else if(sqlFilter=="前第四纪断层"){
          this.hddcFeatureLayer4.getSource().clear();
        }
      },
      //根据版本号清除超图图层要素
      removeRestLayerDataByTypeCode(iIndex,jIndex){
        if(iIndex!=null && jIndex!=null){
          //图层名称
          let realName = this.allRestVectorLayerArray[iIndex][jIndex].name;
          //移除图层
          if(this.allRestVectorLayerArray[iIndex][jIndex].vectorTileLayer!=null){//REST矢量切片图层
            //移除图层
            this.map.removeLayer(this.allRestVectorLayerArray[iIndex][jIndex].vectorTileLayer);
            this.allRestVectorLayerArray[iIndex][jIndex].vectorTileLayer = null;
            this.allRestVectorLayerArray[iIndex][jIndex].vectorTileStyles = null;
          }
          if(this.allRestVectorLayerArray[iIndex][jIndex].restTileLayer!=null){//REST瓦片图层
            //移除图层
            this.map.removeLayer(this.allRestVectorLayerArray[iIndex][jIndex].restTileLayer);
            this.allRestVectorLayerArray[iIndex][jIndex].restTileLayer = null;
          }
          //图层数组移除图层
          this.allRestVectorLayerArray[iIndex].splice(jIndex,1);
          //判断是否此数据类型的版本号超图图层数组为空
          if(this.allRestVectorLayerArray[iIndex].length==0){
            //清空图例
            this.$emit("getLegendHtml",{name:realName,legendHtml:"",show:false});
          }
        }
      },
      //重置清空全部图层数组
      resetClearAllEvent(){
        let list = this.allBaseVectorLayerArray;
        if(list!=null && list.length>0){
          for(let i=0;i<list.length;i++) {
            let selectLayerArray = this.allBaseVectorLayerArray[i];
            if(selectLayerArray!=null && selectLayerArray.length>0){
              for(let j=0;j<selectLayerArray.length;j++){
                //清空图层上的所有要素
                this.allBaseVectorLayerArray[i][j].getSource().clear();
                //移除图层
                this.map.removeLayer(this.allBaseVectorLayerArray[i][j]);
              }
            }
            //清空图层数组
            this.allBaseVectorLayerArray[i] = [];
          }
        }
      },
      //重置清空全部超图图层数组
      resetClearAllRestLayerEvent(){
        let list = this.allRestVectorLayerArray;
        if(list!=null && list.length>0){
          for(let i=0;i<list.length;i++) {
            let selectLayerArray = this.allRestVectorLayerArray[i];
            if(selectLayerArray!=null && selectLayerArray.length>0){
              for(let j=0;j<selectLayerArray.length;j++){
                if(this.allRestVectorLayerArray[i][j]){
                  if (this.allRestVectorLayerArray[i][j].vectorTileLayer != null) {//REST矢量切片图层
                    //移除图层
                    this.map.removeLayer(this.allRestVectorLayerArray[i][j].vectorTileLayer);
                    this.allRestVectorLayerArray[i][j].vectorTileLayer = null;
                    this.allRestVectorLayerArray[i][j].vectorTileStyles = null;
                  }
                  if(this.allRestVectorLayerArray[i][j].restTileLayer!=null){//REST瓦片图层
                    //移除图层
                    this.map.removeLayer(this.allRestVectorLayerArray[i][j].restTileLayer);
                    this.allRestVectorLayerArray[i][j].restTileLayer = null;
                  }
                }
              }
            }
            //清空图层数组
            this.allRestVectorLayerArray[i] = [];
          }
        }
      },
      showDataList(typeCode,selectLayer,versionCode,list){//显示查询图层数据
        if(selectLayer!=null){
          //selectLayer.getSource().clear();//清空
          if(list!=null && list.length>0){
            //全部经纬度
            let allCoordinates = [];
            for(let i=0;i<list.length;i++){
              let id = this.getDataIdByType(typeCode,list[i]);//根据数据类型解析数据主键ID
              let geomText = list[i].geom;//空间数据wkt
              if(geomText!=null && geomText!=""){
                geomText = geomText.toUpperCase();//转换大写字母
                if(geomText.indexOf("POINT")!=-1 || geomText.indexOf("MULTIPOINT")!=-1 ||
                        geomText.indexOf("LINESTRING")!=-1 || geomText.indexOf("MULTILINESTRING")!=-1 ||
                        geomText.indexOf("POLYGON")!=-1 || geomText.indexOf("MULTIPOLYGON")!=-1) {//矢量数据
                  //空间数据
                  let featureTmp = new WKT().readFeature(geomText);
                  if(geomText.indexOf("POINT")!=-1 || geomText.indexOf("MULTIPOINT")!=-1){//点
                    //样式
                    let style = this.getPointStyle();
                    featureTmp.setStyle(style);
                  }else if(geomText.indexOf("LINESTRING")!=-1 || geomText.indexOf("MULTILINESTRING")!=-1){//线
                    //样式
                    let style = this.getLineStringStyle("blue");
                    featureTmp.setStyle(style);
                  }else if(geomText.indexOf("POLYGON")!=-1 || geomText.indexOf("MULTIPOLYGON")!=-1){//面
                    //样式
                    let style = this.getPolyonStyle("blue");
                    featureTmp.setStyle(style);
                  }
                  //设置属性
                  featureTmp.setProperties({
                    id:id,//主键ID
                    //versionCode:versionCode,//版本号
                    typeCode:typeCode,//三级数据类别（数据表）code
                  });
                  //添加矢量数据
                  selectLayer.getSource().addFeature(featureTmp);
                  //获取范围
                  let extent = featureTmp.getGeometry().getExtent();
                  if(extent.length==4){
                    //全部经纬度--左下角
                    allCoordinates.push([extent[0],extent[1]]);
                    //全部经纬度--右上角
                    allCoordinates.push([extent[2],extent[3]]);
                  }
                }
              }
            }
            this.showBoundingExtent(allCoordinates);//缩放到区域位置
          }
        }
      },
      showBoundingExtent(coordinates){//缩放到区域位置
        if (coordinates!=null && coordinates.length > 1) {
          const extent = boundingExtent(coordinates);
          //this.map.getView().fit(extent, {duration: 1000, padding: [50, 50, 50, 50]});
          this.map.getView().fit(extent, {padding: [50, 50, 50, 50]});
          //获取默认位置
          this.center = this.map.getView().getCenter();
          this.zoom = this.map.getView().getZoom();
        }
      },
      getDataIdByType(typeCode,data){//根据数据类型解析数据主键ID
        let id = "";
        //超图ID
        id = "SmID";

        return id;
      },
      getPointStyle(){//点图标样式
        let style = new Style({
          image: new Icon({
            src: dingweiImg,
            anchor: [0.5, 1]
          }),
        });

        return style;
      },
      getPointStyleByColor(color){//点样式
        if(color==null || color===""){
          color = "#00ffff";
        }
        let style = new Style({
          image: new CircleStyle({
            radius: 5,
            fill: new Fill({
              color: "rgba(0,0,0,0)"
            }),
            stroke:new Stroke({//线
              width:2,//宽
              color:color
            })
          })
        });

        return style;
      },
      getLineStringStyle(color){//线样式
        let style = new Style({
          fill:new Fill({//填充样式
            color:"rgba(0,0,0,0)"
          }),
          stroke:new Stroke({//线
            width:2,//宽
            color:color
          })
        });

        return style;
      },
      getPolyonStyle(color){//多边形样式
        let style = new Style({
          fill:new Fill({//填充样式
            color:"rgba(0,0,0,0)"
          }),
          stroke:new Stroke({//描绘
            width:2,//宽
            color:color
          })
        });

        return style;
      },
      //处理经纬度
      getLonLat(longitude,latitude){
        let lonlat = null;
        if(longitude!=null && latitude!=null && longitude!="" && latitude!=""){
          let lon = Number(longitude);
          let lat = Number(latitude);
          if(lon>0 && lon<180 && lat>0 && lat<90){
            lonlat = [lon,lat];
          }
        }

        return lonlat;
      },
      //获取三级数据类别（数据表）code
      getDictItemCode(radioLabel){
        let typeCode = null;
        let list = this.typeCodeDataArray;
        if(list!=null && list.length>0) {
          for (let i = 0; i < list.length; i++) {
            if (list[i].radioLabel==radioLabel) {
              typeCode = list[i].dictItemCode;
              break;
            }
          }
        }

        return typeCode;
      },
      //根据全部序号列表设置全部查询图层数组
      addAllBaseVectorLayerArray(){
        let allLayerArray = [];
        if(this.allRadioIndexList!=null && this.allRadioIndexList.length>0){
          for(let i=0;i<this.allRadioIndexList.length;i++){
            allLayerArray.push([]);
          }
        }
        this.allBaseVectorLayerArray = allLayerArray;
      },
      addAllRestVectorLayerArray(){//全部超图图层数组
        let allLayerArray = [];
        if(this.allRadioIndexList!=null && this.allRadioIndexList.length>0){
          for(let i=0;i<this.allRadioIndexList.length;i++){
            allLayerArray.push([]);
          }
        }
        this.allRestVectorLayerArray = allLayerArray;
      },
      //根据图层序号获取图层数组
      getSelectLayerArray(radioLabel){
        let selectLayerArray = null;//选择图层
        if(this.allRadioIndexList!=null && this.allRadioIndexList.length>0){
          for(let i=0;i<this.allRadioIndexList.length;i++){
            if(this.allRadioIndexList[i]==radioLabel){
              selectLayerArray = this.allBaseVectorLayerArray[i];
              break;
            }
          }
        }

        return selectLayerArray;
      },
      //根据版本号获取图层
      getSelectLayer(selectLayerArray,versionCode){
        let selectLayer = null;//选择图层
        if(selectLayerArray!=null && selectLayerArray.length>0){
          for(let i=0;i<selectLayerArray.length;i++){
            let temp = selectLayerArray[i].getProperties();
            if(temp.versionCode==versionCode){
              selectLayer = selectLayerArray[i];
              break;
            }
          }
        }

        return selectLayer;
      },
      //根据图层序号和版本号设置图层数组
      setBaseVectorLayer(radioLabel,versionCode,bool){
        let selectLayer = null;
        //根据图层序号获取图层数组
        let selectLayerArray = this.getSelectLayerArray(radioLabel);
        //根据版本号获取图层
        selectLayer = this.getSelectLayer(selectLayerArray,versionCode);
        if(bool){//添加图层
          if(selectLayer!=null){
            return selectLayer;
          }
          //创建图层
          selectLayer = new VectorLayer({
            source: new VectorSource({
              wrapX: false
            }),
            projection: 'EPSG:4490'
          });
          this.map.addLayer(selectLayer);
          selectLayer.setZIndex(4);
          selectLayer.setProperties({
            versionCode:versionCode,
          });
          //添加图层数组
          selectLayerArray.push(selectLayer);
        }else{//移除图层
          //根据版本号清除图层要素
          this.removeLayerDataByTypeCode(selectLayerArray,versionCode);
        }

        return selectLayer;
      },
      //根据版本号清除图层要素
      removeLayerDataByTypeCode(selectLayerArray,versionCode){
        //查找版本号图层
        let index = -1;
        if(selectLayerArray!=null && selectLayerArray.length>0){
          for(let i=0;i<selectLayerArray.length;i++){
            let temp = selectLayerArray[i].getProperties();
            if(temp.versionCode==versionCode){
              index = i;
              break;
            }
          }
        }
        if(index!=-1){
          //清空图层上的所有要素
          selectLayerArray[index].getSource().clear();
          //移除图层
          this.map.removeLayer(selectLayerArray[index]);
          //图层数组移除图层
          selectLayerArray.splice(index,1);
        }
      },

      /*//地图显示全部查询结果
      showAllListData() {
        let allDataList = this.allDataList;
        if (allDataList != null && allDataList.length > 0) {
          if (this.siteVectorLayer != null) {
            this.siteVectorLayer.getSource().clear();//清空
            let newVal = this.allDataList;
            let tempCodeArray = [];
            // let code = newVal[i].iaCode;//行政区划code
            if (newVal.length > 0) {
              debugger;
              for (let i = 0; i < newVal.length; i++) {
                //let tempcode = newVal[i].iaCode;//行政区划code
                let tempcode = newVal[i];//行政区划code
                let index = tempCodeArray.indexOf(tempcode);
                if (index == -1) {
                  tempCodeArray.push(tempcode);
                  this.getAddressLonLatByCode(newVal[i]);//根据code获取行政区划经纬度地址
                }
              }
            }
          }
        } else {
          //清空数据
          if (this.siteVectorLayer != null) {
            if (this.siteVectorLayer.getSource() != null) {
              this.siteVectorLayer.getSource().clear();//清空
            }
          }
        }
      },*/
      getAddressLonLatByCode(data) {//根据code获取行政区划经纬度地址
        let code = "156" + data;//行政区划code
        let that = this;
        //按名称查询行政区划
        //let url = 'https://api.tianditu.gov.cn/administrative?postStr={"searchWord":"'+name+'","searchType":"1","needSubInfo":"false","needAll":"false","needPolygon":"false","needPre":"false"}&tk=ad0a520abd480f45a173115c2a80f723';
        //按code查询行政区划
        let url = 'https://api.tianditu.gov.cn/administrative?postStr={"searchWord":"' +  + '","searchType":"0","needSubInfo":"false","needAll":"false","needPolygon":"false","needPre":"false"}&tk=ad0a520abd480f45a173115c2a80f723';
        //行政区划查询
        let httpRequest = new XMLHttpRequest();//第一步：建立所需的对象
        httpRequest.open('GET', url, true);//第二步：打开连接  将请求参数写在url中  ps:"http://localhost:8080/rest/xxx"
        httpRequest.send();//第三步：发送请求  将请求参数写在URL中
        /**
         * 获取数据后的处理程序
         */
        httpRequest.onreadystatechange = function () {
          if (httpRequest.readyState == 4 && httpRequest.status == 200) {
            let json = httpRequest.responseText;//获取到json字符串，还需解析
            let obj = JSON.parse(json);
            let returncode = obj.returncode;
            if (returncode == "100") {//正常查询
              let longitude = obj.data.lnt;
              let latitude = obj.data.lat;
              //处理经纬度
              let lonlat = that.getLonLat(longitude, latitude)
              if (lonlat != null) {
                //点
                let featureTmp = new Feature({
                  geometry: new Point(lonlat)
                });
                //样式
                let style = that.getPointStyle();
                featureTmp.setStyle(style);
                //设置属性
                featureTmp.setProperties(data);
                //添加活动
                that.siteVectorLayer.getSource().addFeature(featureTmp);
              }
            }
          }
        };
      },
      //测试全部超图服务
      testAllSuperMap() {

      },
      //地图服务
      queryBySqlMap() {//SQL查询超图地图
        let that = this;
        //SQL查询地图
        let url = (window.isLocal ? window.server : "https://iserver.supermap.io") + "/iserver/services/map-world/rest/maps/World";
        let param = new QueryBySQLParameters({
          queryParams: {
            name: "Capitals@World.1",
            attributeFilter: "SMID < 10"
          }
        });
        new QueryService(url).queryBySQL(param, function (serviceResult) {
          if (serviceResult.result != undefined) {
            let vectorSource = new VectorSource({
              features: (new GeoJSON()).readFeatures(serviceResult.result.recordsets[0].features),
              wrapX: false
            });
            let resultLayer = new VectorLayer({
              source: vectorSource,
              projection: 'EPSG:4490'
            });
            that.map.addLayer(resultLayer);
            //设置图层叠加顺序
            resultLayer.setZIndex(1);
          }
        });
      },
      queryByBoundsMap() {//范围查询超图地图
        let that = this;
        //范围
        let polygon = new Polygon([[[0, 0], [60, 0], [60, 39], [0, 39], [0, 0]]]);
        let polygonSource = new VectorSource({
          features: [new Feature(polygon)],
          wrapX: false
        });
        let vectorLayer = new VectorLayer({
          source: polygonSource,
          projection: 'EPSG:4490',
          style: new Style({
            stroke: new Stroke({
              color: 'blue',
              width: 3
            }),
            fill: new Fill({
              color: 'rgba(0, 0, 255, 0.1)'
            })
          })
        });
        this.map.addLayer(vectorLayer);
        //设置图层叠加顺序
        vectorLayer.setZIndex(1);
        //范围查询地图
        let url = (window.isLocal ? window.server : "https://iserver.supermap.io") + "/iserver/services/map-world/rest/maps/World";
        let param = new QueryByBoundsParameters({
          queryParams: { name: "Capitals@World.1" },
          bounds: polygon.getExtent()
        });
        new QueryService(url).queryByBounds(param, function (serviceResult) {
          if (serviceResult.result != undefined) {
            let vectorSource = new VectorSource({
              features: (new GeoJSON()).readFeatures(serviceResult.result.recordsets[0].features),
              wrapX: false
            });
            let resultLayer = new VectorLayer({
              source: vectorSource,
              projection: 'EPSG:4490'
            });
            that.map.addLayer(resultLayer);
            //设置图层叠加顺序
            resultLayer.setZIndex(1);
          }
        });
      },
      queryByGeometryMap() {//几何查询超图地图
        let that = this;
        //多边形区域
        let polygon = new Polygon([[[0, 0], [-30, 0], [-10, 30], [0, 0]]]);
        let polygonSource = new VectorSource({
          features: [new Feature(polygon)],
          wrapX: false
        });
        let vectorLayer = new VectorLayer({
          source: polygonSource,
          projection: 'EPSG:4490',
          style: new Style({
            stroke: new Stroke({
              color: 'red',
              width: 3
            }),
            fill: new Fill({
              color: 'rgba(0, 0, 255, 0.1)'
            })
          })
        });
        this.map.addLayer(vectorLayer);
        //设置图层叠加顺序
        vectorLayer.setZIndex(1);
        //几何查询地图
        let url = (window.isLocal ? window.server : "https://iserver.supermap.io") + "/iserver/services/map-world/rest/maps/World";
        let param = new QueryByGeometryParameters({
          queryParams: { name: "Capitals@World.1" },
          geometry: polygon
        });
        new QueryService(url).queryByGeometry(param, function (serviceResult) {
          if (serviceResult.result != undefined) {
            let vectorSource = new VectorSource({
              features: (new GeoJSON()).readFeatures(serviceResult.result.recordsets[0].features),
              wrapX: false
            });
            let resultLayer = new VectorLayer({
              source: vectorSource,
              projection: 'EPSG:4490'
            });
            that.map.addLayer(resultLayer);
            //设置图层叠加顺序
            resultLayer.setZIndex(1);
          }
        });
      },
      queryByDistanceMap() {//距离查询超图地图
        let that = this;
        //添加查询中心点
        let point = new Point([74, 30]);
        let iconStyle = new Style({
          image: new Icon({
            src: dingweiImg,
            anchor: [0.5, 1]
          }),
        });
        let feature = new Feature(point);
        feature.setStyle(iconStyle);
        let pointSource = new VectorSource({
          features: [feature],
          wrapX: false
        });
        let vectorLayer = new VectorLayer({
          source: pointSource,
          projection: 'EPSG:4490'
        });
        this.map.addLayer(vectorLayer);
        //设置图层叠加顺序
        vectorLayer.setZIndex(1);
        //距离查询地图
        let url = (window.isLocal ? window.server : "https://iserver.supermap.io") + "/iserver/services/map-world/rest/maps/World";
        let param = new QueryByDistanceParameters({
          queryParams: { name: "Capitals@World.1" },
          distance: 10,
          geometry: point
        });
        //创建距离查询实例
        new QueryService(url).queryByDistance(param, function (serviceResult) {
          if (serviceResult.result != undefined) {
            let vectorSource = new VectorSource({
              features: (new GeoJSON()).readFeatures(serviceResult.result.recordsets[0].features),
              wrapX: false
            });
            let resultLayer = new VectorLayer({
              source: vectorSource,
              projection: 'EPSG:4490'
            });
            that.map.addLayer(resultLayer);
            //设置图层叠加顺序
            resultLayer.setZIndex(1);
          }
        });
      },
      //数据服务
      queryByIDsData() {//ID查询超图数据
        let that = this;
        //ID查询数据
        let url = (window.isLocal ? window.server : "https://iserver.supermap.io") + "/iserver/services/data-world/rest/data";
        let idsParam = new GetFeaturesByIDsParameters({
          IDs: [233, 234],
          datasetNames: ["World:Countries"]
        });
        new FeatureService(url).getFeaturesByIDs(idsParam, function (serviceResult) {
          if (serviceResult.result != undefined) {
            let vectorSource = new VectorSource({
              features: (new GeoJSON()).readFeatures(serviceResult.result.features),
              wrapX: false
            });
            let resultLayer = new VectorLayer({
              source: vectorSource,
              projection: 'EPSG:4490'
            });
            that.map.addLayer(resultLayer);
            //设置图层叠加顺序
            resultLayer.setZIndex(1);
          }
        });
      },
      queryBySQLData() {//SQL查询超图数据
        let that = this;
        //SQL查询数据
        //let url = (window.isLocal ? window.server : "https://iserver.supermap.io")+"/iserver/services/data-world/rest/data";
        let url = "http://10.13.155.192:8090/iserver/services/map-fxfzypg/rest/maps/district_boundary_province@fxfzypg";
        let sqlParam = new GetFeaturesBySQLParameters({
          queryParameter: {
            //name: "Countries@World",
            //attributeFilter: "SMID = 230"
            name: "district_boundary_province@fxfzypg",
            attributeFilter: "name like '%市'"
          },
          datasetNames: ["World:Countries"]
        });
        new FeatureService(url).getFeaturesBySQL(sqlParam, function (serviceResult) {
          if (serviceResult.result != undefined) {
            //添加矢量数据
            let features = serviceResult.result.recordsets[0].features.features;
            if (features.length > 0) {
              let featuresArray = [];
              for (let i = 0; i < features.length; i++) {
                let feature = (new GeoJSON()).readFeature(features[i].geometry);
                featuresArray.push(feature);
              }
              let vectorSource = new VectorSource({
                features: featuresArray,
                wrapX: false
              });
              let resultLayer = new VectorLayer({
                source: vectorSource,
                projection: 'EPSG:4490'
              });
              that.map.addLayer(resultLayer);
              //设置图层叠加顺序
              resultLayer.setZIndex(2);
            }
          }
        });
      },
      queryByBoundsData() {//范围查询超图数据
        let that = this;
        //添加查询区域
        let polygon = new Polygon([[[-20, 20], [-20, -20], [20, -20], [20, 20], [-20, 20]]]);
        let polygonSource = new VectorSource({
          features: [new Feature(polygon)],
          wrapX: false
        });
        let vectorLayer = new VectorLayer({
          source: polygonSource,
          projection: 'EPSG:4490',
          style: new Style({
            stroke: new Stroke({
              color: 'red',
              width: 3
            }),
            fill: new Fill({
              color: 'rgba(0, 0, 255, 0.1)'
            })
          })
        });
        this.map.addLayer(vectorLayer);
        //设置图层叠加顺序
        vectorLayer.setZIndex(1);
        //创建集Bounds查询服务
        let url = (window.isLocal ? window.server : "https://iserver.supermap.io") + "/iserver/services/data-world/rest/data";
        let boundsParam = new GetFeaturesByBoundsParameters({
          datasetNames: ["World:Capitals"],
          bounds: polygon.getExtent()
        });
        new FeatureService(url).getFeaturesByBounds(boundsParam, function (serviceResult) {
          if (serviceResult.result != undefined) {
            let vectorSource = new VectorSource({
              features: (new GeoJSON()).readFeatures(serviceResult.result.features),
              wrapX: false
            });
            let resultLayer = new VectorLayer({
              source: vectorSource,
              projection: 'EPSG:4490'
            });
            that.map.addLayer(resultLayer);
            //设置图层叠加顺序
            resultLayer.setZIndex(1);
          }
        });
      },
      queryByGeometryData() {//几何查询超图数据
        let that = this;
        //多边形区域
        let polygon = new Polygon([[[0, 0], [-10, 30], [-30, 0], [0, 0]]]);
        let polygonSource = new VectorSource({
          features: [new Feature(polygon)],
          wrapX: false
        });
        let vectorLayer = new VectorLayer({
          source: polygonSource,
          projection: 'EPSG:4490',
          style: new Style({
            stroke: new Stroke({
              color: 'red',
              width: 3
            }),
            fill: new Fill({
              color: 'rgba(0, 0, 255, 0.1)'
            })
          })
        });
        this.map.addLayer(vectorLayer);
        //设置图层叠加顺序
        vectorLayer.setZIndex(1);
        //几何查询数据
        let url = (window.isLocal ? window.server : "https://iserver.supermap.io") + "/iserver/services/data-world/rest/data";
        let geometryParam = new GetFeaturesByGeometryParameters({
          datasetNames: ["World:Countries"],
          geometry: polygon,
          spatialQueryMode: "INTERSECT"
        });
        new FeatureService(url).getFeaturesByGeometry(geometryParam, function (serviceResult) {
          console.log("几何查询超图数据结果");
          console.log(serviceResult);
          if (serviceResult.result != undefined) {
            let vectorSource = new VectorSource({
              features: (new GeoJSON()).readFeatures(serviceResult.result.features),
              wrapX: false
            });
            let resultLayer = new VectorLayer({
              source: vectorSource,
              projection: 'EPSG:4490'
            });
            that.map.addLayer(resultLayer);
            //设置图层叠加顺序
            resultLayer.setZIndex(1);
          }
        });
      },
      queryByBufferData() {//缓冲区查询超图数据
        let that = this;
        //多边形区域
        let polygon = new Polygon([[[-20, 20], [-20, -20], [20, -20], [20, 20], [-20, 20]]]);
        let polygonSource = new VectorSource({
          features: [new Feature(polygon)],
          wrapX: false
        });
        let vectorLayer = new VectorLayer({
          source: polygonSource,
          projection: 'EPSG:4490',
          style: new Style({
            stroke: new Stroke({
              color: 'red',
              width: 3
            }),
            fill: new Fill({
              color: 'rgba(0, 0, 255, 0.1)'
            })
          })
        });
        this.map.addLayer(vectorLayer);
        //设置图层叠加顺序
        vectorLayer.setZIndex(1);
        //缓冲区查询数据
        let url = (window.isLocal ? window.server : "https://iserver.supermap.io") + "/iserver/services/data-world/rest/data";
        let bufferParam = new GetFeaturesByBufferParameters({
          datasetNames: ["World:Capitals"],
          bufferDistance: 30,
          geometry: polygon
        });
        new FeatureService(url).getFeaturesByBuffer(bufferParam, function (serviceResult) {
          if (serviceResult.result != undefined) {
            let vectorSource = new VectorSource({
              features: (new GeoJSON()).readFeatures(serviceResult.result.features),
              wrapX: false
            });
            let resultLayer = new VectorLayer({
              source: vectorSource,
              projection: 'EPSG:4490'
            });
            that.map.addLayer(resultLayer);
            //设置图层叠加顺序
            resultLayer.setZIndex(1);
          }
        });
      },
      createImgFuntion() {
        // if(this.createImgBool) {
        //   this.createImgBool = false
        this.$emit('manual', true)
        // }else{
        //   this.createImgBool = true
        //   this.$emit('manual',false)
        // }
      },
      //专题图
      createThemeDotDensity() {//点密度专题图
        let that = this;
        let url = (window.isLocal ? window.server : "https://iserver.supermap.io") + "/iserver/services/map-world/rest/maps/World";
        //瓦片地图图层
        this.createMapLayer(url, 0);//根据url和zIndex添加瓦片地图图层
        //点密度专题图
        let themeDotDensity = new ThemeDotDensity({
          dotExpression: "Pop_1994",
          value: 5000000,
          style: new ServerStyle({
            markerSize: 3,
            markerSymbolID: 12
          })
        });
        let themeParameters = new ThemeParameters({
          themes: [themeDotDensity],
          datasetNames: ["Countries"],
          dataSourceNames: ["World"]
        });
        //创建点密度专题图
        new ThemeService(url).getThemeInfo(themeParameters, function (serviceResult) {
          if (serviceResult.result != undefined) {
            let result = serviceResult.result;
            if (result && result.newResourceID) {
              let themeLayer = new TileLayer({
                source: new TileSuperMapRest({
                  url: url,
                  noWrap: true,
                  cacheEnabled: false,
                  layersID: result.newResourceID,
                  transparent: true
                }),
                projection: 'EPSG:4490'
              });
              that.map.addLayer(themeLayer);
              //设置图层叠加顺序
              themeLayer.setZIndex(2);
            }
          }
        });
      },
      createThemeGraduatedSymbol() {//等级符号专题图
        let that = this;
        //let url = (window.isLocal ? window.server : "https://iserver.supermap.io")+"/iserver/services/map-china400/rest/maps/China";
        let url = (window.isLocal ? window.server : "https://iserver.supermap.io") + "/iserver/services/map-world/rest/maps/World";
        //瓦片地图图层
        this.createMapLayer(url, 0);//根据url和zIndex添加瓦片地图图层
        //等级符号专题图
        let themeGraduatedSymbol = new ThemeGraduatedSymbol({
          expression: "SMAREA",
          baseValue: 3000000000000,
          graduatedMode: GraduatedMode.CONSTANT,
          style: new ThemeGraduatedSymbolStyle({
            positiveStyle: new ServerStyle({
              markerSize: 50,
              markerSymbolID: 0,
              lineColor: new ServerColor(255, 165, 0),
              fillBackColor: new ServerColor(255, 0, 0)
            })
          })
        });
        let themeParameters = new ThemeParameters({
          themes: [themeGraduatedSymbol],
          datasetNames: ["Countries"],
          dataSourceNames: ["World"]
        });
        //创建等级符号专题图
        new ThemeService(url).getThemeInfo(themeParameters, function (serviceResult) {
          if (serviceResult.result != undefined) {
            let result = serviceResult.result;
            if (result && result.newResourceID) {
              let themeLayer = new TileLayer({
                source: new TileSuperMapRest({
                  url: url,
                  noWrap: true,
                  cacheEnabled: false,
                  layersID: result.newResourceID,
                  transparent: true
                }),
                projection: 'EPSG:4490'
              });
              that.map.addLayer(themeLayer);
              //设置图层叠加顺序
              themeLayer.setZIndex(1);
            }
          }
        });
      },
      createThemeGraph() {//统计专题图
        let that = this;
        let host = (window.isLocal ? window.server : "https://iserver.supermap.io");
        let mapUrl = host + "/iserver/services/map-jingjin/rest/maps/京津地区地图";
        let url = host + "/iserver/services/map-jingjin/rest/maps/京津地区人口分布图_专题图";
        //瓦片地图图层
        this.createMapLayer(url, 1);//根据url和zIndex添加瓦片地图图层
        //统计专题图
        let themeGraph = new ThemeGraph({
          items: [
            new ThemeGraphItem({
              caption: "1992-1995人口增长率",
              graphExpression: "Pop_Rate95",
              uniformStyle: new ServerStyle({
                fillForeColor: new ServerColor(92, 73, 234),
                lineWidth: 0.1
              })
            }),
            new ThemeGraphItem({
              caption: "1995-1999人口增长率",
              graphExpression: "Pop_Rate99",
              uniformStyle: new ServerStyle({
                fillForeColor: new ServerColor(211, 111, 240),
                lineWidth: 0.1
              })
            })
          ],
          barWidth: 0.03,
          graduatedMode: GraduatedMode.SQUAREROOT,
          graphAxes: new ThemeGraphAxes({
            axesDisplayed: true
          }),
          graphSize: new ThemeGraphSize({
            maxGraphSize: 1,
            minGraphSize: 0.35
          }),
          graphText: new ThemeGraphText({
            graphTextDisplayed: true,
            graphTextFormat: ThemeGraphTextFormat.VALUE,
            graphTextStyle: new ServerTextStyle({
              sizeFixed: true,
              fontHeight: 9,
              fontWidth: 5
            })
          }),
          graphType: ThemeGraphType.BAR3D
        });
        let themeParameters = new ThemeParameters({
          themes: [themeGraph],
          dataSourceNames: ["Jingjin"],
          datasetNames: ["BaseMap_R"]
        });

        let extent = [114.59, 37.76, 119.51, 42.31];
        //创建统计专题图
        new ThemeService(url).getThemeInfo(themeParameters, function (serviceResult) {
          if (serviceResult.result != undefined) {
            let result = serviceResult.result;
            if (result && result.newResourceID) {
              let themeLayer = new TileLayer({
                source: new TileSuperMapRest({
                  url: url,
                  noWrap: true,
                  cacheEnabled: false,
                  layersID: result.newResourceID,
                  transparent: true,
                  /*tileGrid: new TileGrid({
                    extent: extent,
                    resolutions: options.tileGrid.getResolutions()
                  }),*/
                }),
                projection: 'EPSG:4490'
              });
              that.map.addLayer(themeLayer);
              //设置图层叠加顺序
              themeLayer.setZIndex(1);
            }
          }
        });
      },
      createThemeLabel() {//标签专题图
        let that = this;
        let url = (window.isLocal ? window.server : "https://iserver.supermap.io") + "/iserver/services/map-world/rest/maps/World";
        //瓦片地图图层
        this.createMapLayer(url, 0);//根据url和zIndex添加瓦片地图图层
        //标签专题图
        let style1, style2, style3;
        style1 = new ServerTextStyle({
          fontHeight: 4,
          foreColor: new ServerColor(100, 20, 50),
          sizeFixed: true,
          bold: true

        });
        style2 = new ServerTextStyle({
          fontHeight: 4,
          foreColor: new ServerColor(250, 0, 0),
          sizeFixed: true,
          bold: true
        });
        style3 = new ServerTextStyle({
          fontHeight: 4,
          foreColor: new ServerColor(93, 95, 255),
          sizeFixed: true,
          bold: true
        });
        let themeLabelItem1, themeLabelItem2, themeLabelItem3, themeLabelItem4, themeLabelItem5, themeLabelItem6;
        themeLabelItem1 = new ThemeLabelItem({
          start: 0.0,
          end: 7800000,
          style: style1
        });
        themeLabelItem2 = new ThemeLabelItem({
          start: 7800000,
          end: 15000000,
          style: style2
        });
        themeLabelItem3 = new ThemeLabelItem({
          start: 15000000,
          end: 30000000,
          style: style3
        });
        themeLabelItem4 = new ThemeLabelItem({
          start: 0.0,
          end: 55,
          style: style1
        });
        themeLabelItem5 = new ThemeLabelItem({
          start: 55,
          end: 109,
          style: style2
        });
        themeLabelItem6 = new ThemeLabelItem({
          start: 109,
          end: 300,
          style: style3
        });

        let themeLabel = new ThemeLabel({
          matrixCells: [
            [new LabelThemeCell({
              themeLabel: new ThemeLabel({
                labelExpression: "CAPITAL",
                rangeExpression: "SmID",
                numericPrecision: 0,
                items: [themeLabelItem4, themeLabelItem5, themeLabelItem6]
              })
            })],
            [new LabelThemeCell({
              themeLabel: new ThemeLabel({
                labelExpression: "CAP_POP",
                rangeExpression: "CAP_POP",
                numericPrecision: 0,
                items: [themeLabelItem1, themeLabelItem2, themeLabelItem3]
              })
            })]
          ],
          background: new ThemeLabelBackground({
            backStyle: new ServerStyle({
              fillForeColor: new ServerColor(179, 209, 193),
              fillOpaqueRate: 60,
              lineWidth: 0.1
            }),
            labelBackShape: "RECT"
          })
        });
        let themeParameters = new ThemeParameters({
          themes: [themeLabel],
          datasetNames: ["Capitals"],
          dataSourceNames: ["World"]
        });
        //创建标签专题图
        new ThemeService(url).getThemeInfo(themeParameters, function (serviceResult) {
          console.log("标签专题图");
          console.log(serviceResult);
          if (serviceResult.result != undefined) {
            let result = serviceResult.result;
            if (result && result.newResourceID) {
              let themeLayer = new TileLayer({
                source: new TileSuperMapRest({
                  url: url,
                  noWrap: true,
                  cacheEnabled: false,
                  layersID: result.newResourceID,
                  transparent: true
                }),
                projection: 'EPSG:4490'
              });
              that.map.addLayer(themeLayer);
              //设置图层叠加顺序
              themeLayer.setZIndex(1);
            }
          }
        });
      },
      createThemeRange() {//分段专题图
        let that = this;
        //let url = (window.isLocal ? window.server : "https://iserver.supermap.io")+"/iserver/services/map-china400/rest/maps/China";
        let url = (window.isLocal ? window.server : "https://iserver.supermap.io") + "/iserver/services/map-world/rest/maps/World";
        //瓦片地图图层
        this.createMapLayer(url, 0);//根据url和zIndex添加瓦片地图图层
        //分段专题图
        let themeRangeItem1, themeRangeItem2, themeRangeItem3, themeRange;
        themeRangeItem1 = new ThemeRangeItem({
          start: 0,
          end: 500000000000,
          style: new ServerStyle({
            fillForeColor: new ServerColor(211, 255, 250),
            lineColor: new ServerColor(179, 209, 193),
            lineWidth: 0.1
          })
        });
        themeRangeItem2 = new ThemeRangeItem({
          start: 500000000000,
          end: 1000000000000,
          style: new ServerStyle({
            fillForeColor: new ServerColor(178, 218, 199),
            lineColor: new ServerColor(179, 209, 193),
            lineWidth: 0.1
          })
        });
        themeRangeItem3 = new ThemeRangeItem({
          start: 1000000000000,
          end: 3000000000000,
          style: new ServerStyle({
            fillForeColor: new ServerColor(58, 178, 166),
            lineColor: new ServerColor(179, 209, 193),
            lineWidth: 0.1
          })
        });
        themeRange = new ThemeRange({
          rangeExpression: "SMAREA",
          rangeMode: RangeMode.EQUALINTERVAL,
          items: [themeRangeItem1, themeRangeItem2, themeRangeItem3]
        });
        let themeParameters = new ThemeParameters({
          datasetNames: ["Countries"],
          dataSourceNames: ["World"],
          joinItems: null,
          themes: [themeRange]
        });
        //创建分段专题图
        new ThemeService(url).getThemeInfo(themeParameters, function (serviceResult) {
          console.log("分段专题图");
          console.log(serviceResult);
          if (serviceResult.result != undefined) {
            let result = serviceResult.result;
            if (result && result.newResourceID) {
              let themeLayer = new TileLayer({
                source: new TileSuperMapRest({
                  url: url,
                  noWrap: true,
                  cacheEnabled: false,
                  layersID: result.newResourceID,
                  transparent: true
                }),
                projection: 'EPSG:4490'
              });
              that.map.addLayer(themeLayer);
              //设置图层叠加顺序
              themeLayer.setZIndex(1);
            }
          }
        });
      },
      createThemeUnique() {//单值专题图
        let that = this;
        let url = (window.isLocal ? window.server : "https://iserver.supermap.io") + "/iserver/services/map-china400/rest/maps/China";
      },
      createThemeGridRange() {//栅格分段专题图
        let that = this;
        let url = (window.isLocal ? window.server : "https://iserver.supermap.io") + "/iserver/services/map-jingjin/rest/maps/京津地区人口分布图_专题图";
        //瓦片地图图层
        this.createMapLayer(url, 0);//根据url和zIndex添加瓦片地图图层
        //栅格分段专题图
        let themeGridRangeItem1 = new ThemeGridRangeItem({
                  start: -4,
                  end: 120,
                  color: new ServerColor(198, 244, 240)
                }),
                themeGridRangeItem2 = new ThemeGridRangeItem({
                  start: 120,
                  end: 240,
                  color: new ServerColor(176, 244, 188)
                }),
                themeGridRangeItem3 = new ThemeGridRangeItem({
                  start: 240,
                  end: 360,
                  color: new ServerColor(218, 251, 178)
                }),
                themeGridRangeItem4 = new ThemeGridRangeItem({
                  start: 360,
                  end: 480,
                  color: new ServerColor(220, 236, 145)
                }),
                themeGridRangeItem5 = new ThemeGridRangeItem({
                  start: 480,
                  end: 600,
                  color: new ServerColor(96, 198, 66)
                }),
                themeGridRangeItem6 = new ThemeGridRangeItem({
                  start: 600,
                  end: 720,
                  color: new ServerColor(20, 142, 53)
                }),
                themeGridRangeItem7 = new ThemeGridRangeItem({
                  start: 720,
                  end: 840,
                  color: new ServerColor(85, 144, 55)
                }),
                themeGridRangeItem8 = new ThemeGridRangeItem({
                  start: 840,
                  end: 960,
                  color: new ServerColor(171, 168, 38)
                }),
                themeGridRangeItem9 = new ThemeGridRangeItem({
                  start: 960,
                  end: 1100,
                  color: new ServerColor(235, 165, 9)
                }),
                themeGridRangeItem10 = new ThemeGridRangeItem({
                  start: 1100,
                  end: 1220,
                  color: new ServerColor(203, 89, 2)
                }),
                themeGridRangeItem11 = new ThemeGridRangeItem({
                  start: 1220,
                  end: 1340,
                  color: new ServerColor(157, 25, 1)
                }),
                themeGridRangeItem12 = new ThemeGridRangeItem({
                  start: 1340,
                  end: 1460,
                  color: new ServerColor(118, 15, 3)
                }),
                themeGridRangeItem13 = new ThemeGridRangeItem({
                  start: 1460,
                  end: 1600,
                  color: new ServerColor(112, 32, 7)
                }),
                themeGridRangeItem14 = new ThemeGridRangeItem({
                  start: 1600,
                  end: 1800,
                  color: new ServerColor(106, 45, 12)
                }),
                themeGridRangeItem15 = new ThemeGridRangeItem({
                  start: 1800,
                  end: 2000,
                  color: new ServerColor(129, 80, 50)
                }),
                themeGridRangeItem16 = new ThemeGridRangeItem({
                  start: 2000,
                  end: 2167,
                  color: new ServerColor(160, 154, 146)
                });
        let themeGridRange = new ThemeGridRange({
          reverseColor: false,
          rangeMode: RangeMode.EQUALINTERVAL,
          items: [
            themeGridRangeItem1, themeGridRangeItem2,
            themeGridRangeItem3, themeGridRangeItem4,
            themeGridRangeItem5, themeGridRangeItem6,
            themeGridRangeItem7, themeGridRangeItem8,
            themeGridRangeItem9, themeGridRangeItem10,
            themeGridRangeItem11, themeGridRangeItem12,
            themeGridRangeItem13, themeGridRangeItem14,
            themeGridRangeItem15, themeGridRangeItem16
          ]
        });
        let themeParameters = new ThemeParameters({
          datasetNames: ["JingjinTerrain"],
          dataSourceNames: ["Jingjin"],
          joinItems: null,
          themes: [themeGridRange]
        });

        let extent = [114.59, 37.76, 119.51, 42.31];
        //创建栅格分段专题图
        new ThemeService(url).getThemeInfo(themeParameters, function (serviceResult) {
          console.log("栅格分段专题图");
          console.log(serviceResult);
          if (serviceResult.result != undefined) {
            let result = serviceResult.result;
            if (result && result.newResourceID) {
              let themeLayer = new TileLayer({
                source: new TileSuperMapRest({
                  url: url,
                  noWrap: true,
                  cacheEnabled: false,
                  layersID: result.newResourceID,
                  transparent: true,
                  /*tileGrid: new TileGrid({
                    extent: extent,
                    resolutions: options.tileGrid.getResolutions()
                  }),*/
                }),
                projection: 'EPSG:4490'
              });
              that.map.addLayer(themeLayer);
              //设置图层叠加顺序
              themeLayer.setZIndex(1);
            }
          }
        });
      },
      createThemeGridUnique() {//栅格单值专题图
        let that = this;
        let url = (window.isLocal ? window.server : "https://iserver.supermap.io") + "/iserver/services/map-jingjin/rest/maps/京津地区地图";
        //瓦片地图图层
        this.createMapLayer(url, 0);//根据url和zIndex添加瓦片地图图层
        //栅格单值专题图样式
        function setItems() {
          let items = [],
                  color0 = new ServerColor(198, 244, 240),
                  color1 = new ServerColor(176, 244, 188),
                  color2 = new ServerColor(218, 251, 178),
                  color3 = new ServerColor(220, 236, 145),
                  color4 = new ServerColor(96, 198, 66),
                  color5 = new ServerColor(20, 142, 53),
                  color6 = new ServerColor(85, 144, 55),
                  color7 = new ServerColor(171, 168, 38),
                  color8 = new ServerColor(235, 165, 9),
                  color9 = new ServerColor(203, 89, 2),
                  color10 = new ServerColor(157, 25, 1),
                  color11 = new ServerColor(118, 15, 3),
                  color12 = new ServerColor(112, 32, 7),
                  color13 = new ServerColor(106, 45, 12),
                  color14 = new ServerColor(129, 80, 50),
                  color15 = new ServerColor(160, 154, 146);
          for (let i = -4; i < 2197; i++) {
            let num = parseInt(i / 135);
            let item = new ThemeGridUniqueItem();
            item.caption = 1;
            item.unique = i;
            item.visible = true;
            switch (num) {
              case 0:
                item.color = color0;
                break;
              case 1:
                item.color = color1;
                break;
              case 2:
                item.color = color2;
                break;
              case 3:
                item.color = color3;
                break;
              case 4:
                item.color = color4;
                break;
              case 5:
                item.color = color5;
                break;
              case 6:
                item.color = color6;
                break;
              case 7:
                item.color = color7;
                break;
              case 8:
                item.color = color8;
                break;
              case 9:
                item.color = color9;
                break;
              case 10:
                item.color = color10;
                break;
              case 11:
                item.color = color11;
                break;
              case 12:
                item.color = color12;
                break;
              case 13:
                item.color = color13;
                break;
              case 14:
                item.color = color14;
                break;
              case 15:
                item.color = color15;
                break;
              default:
                item.color = color0;
                break;
            }
            items.push(item);
          }
          return items;
        }
        //栅格单值专题图
        let themeGridUnique = new ThemeGridUnique({
          defaultcolor: new ServerColor(0, 0, 0),
          items: setItems()
        });
        let themeParameters = new ThemeParameters({
          datasetNames: ["JingjinTerrain"],
          dataSourceNames: ["Jingjin"],
          themes: [themeGridUnique]
        });

        let extent = [114.59, 37.76, 119.51, 42.31];
        new ThemeService(url).getThemeInfo(themeParameters, function (serviceResult) {
          console.log("栅格单值专题图");
          console.log(serviceResult);
          if (serviceResult.result != undefined) {
            let result = serviceResult.result;
            if (result && result.newResourceID) {
              let themeLayer = new TileLayer({
                source: new TileSuperMapRest({
                  url: url,
                  noWrap: true,
                  cacheEnabled: false,
                  transparent: true,
                  layersID: result.newResourceID,
                  /*tileGrid: new ol.tilegrid.TileGrid({
                    extent: extent,
                    resolutions: options.tileGrid.getResolutions()
                  }),*/
                }),
                projection: 'EPSG:4490'
              });
              that.map.addLayer(themeLayer);
              //设置图层叠加顺序
              themeLayer.setZIndex(1);
            }
          }
        });
      },
      createMapLayer(url, zIndex) {//根据REST图层url和zIndex添加瓦片地图图层WMTS
        let that = this;
        //瓦片地图图层
        let mapService = new MapService(url);//根据超图REST图层获取图层信息
        mapService.getMapInfo(function (serviceResult) {
          console.log("瓦片地图图层");
          console.log(serviceResult);
          if (serviceResult.result != undefined) {
            let mapJSONObj = serviceResult.result;
            console.log("mapJSONObj");
            console.log(mapJSONObj);
            /*
            //获取超图发布的REST图层
            let options = TileSuperMapRest.optionsFromMapJSON(url, mapJSONObj);
            let layer = new TileLayer({
              source: new TileSuperMapRest(options),
              projection: getProjection()
            });
            that.map.addLayer(layer);
            //设置图层叠加顺序
            layer.setZIndex(zIndex);
            */
            //超图发布的WMTS图层（自定义比例尺）URL
            let wmtsUrl = 'http://10.13.155.192:8090/iserver/services/map-fxfzypg/wmts-fxpc';
            let layerName = mapJSONObj.name;//图层名称
            //获取图层范围
            let bounds = mapJSONObj.bounds;
            let left = bounds.left;
            let bottom = bounds.bottom;
            let right = bounds.right;
            let top = bounds.top;
            let origin = [left, top];//左上角
            let extent = [left, bottom, right, top];//图层范围
            //获取超图发布的WMTS图层（自定义比例尺）
            let layer = getWMTSLayer(wmtsUrl, layerName, origin, extent);
            that.map.addLayer(layer);
            //设置图层叠加顺序
            layer.setZIndex(zIndex);
          }
        });
      },
      /*createMapRestLayer(layerUrl, layerID, zIndex) {//根据layerUrl、临时图层layerID和zIndex查询并添加瓦片地图图层REST
        let that = this;
        //瓦片地图图层
        let mapService = new MapService(layerUrl);//根据超图REST图层获取图层信息
        mapService.getMapInfo(function (serviceResult) {
          console.log("瓦片地图图层");
          console.log(serviceResult);
          if (serviceResult.result != undefined) {
            let mapJSONObj = serviceResult.result;
            console.log("mapJSONObj");
            console.log(mapJSONObj);
            //获取超图发布的REST图层
            //let options = TileSuperMapRest.optionsFromMapJSON(layerUrl, mapJSONObj);
            let layerName = mapJSONObj.name;//图层名称
            //获取图层范围
            let bounds = mapJSONObj.bounds;
            let left = bounds.left;
            let bottom = bounds.bottom;
            let right = bounds.right;
            let top = bounds.top;
            let origin = [left, top];//左上角
            let extent = [left, bottom, right, top];//图层范围
            //获取超图发布的REST图层（自定义比例尺）
            let layer = getRESTLayer(layerUrl, layerID, origin, extent);
            that.map.addLayer(layer);
            //设置图层叠加顺序
            layer.setZIndex(zIndex);
          }
        });
      },*/
      //REST图层查询
      createMapRestLayer(iIndex,jIndex,layerUrl,layerID,zIndex){//根据layerUrl、临时图层layerID和zIndex查询并添加瓦片地图图层REST
        let that = this;
        //瓦片地图图层
        let mapService = new MapService(layerUrl);//根据超图REST图层获取图层信息
        mapService.getMapInfo(function (serviceResult) {
          if(serviceResult.result!=undefined){
            let mapJSONObj = serviceResult.result;
            //获取超图发布的REST图层
            //let options = TileSuperMapRest.optionsFromMapJSON(layerUrl, mapJSONObj);
            let layerName = mapJSONObj.name;//图层名称
            //获取图层范围
            let bounds = mapJSONObj.bounds;
            let left = bounds.left;
            let bottom = bounds.bottom;
            let right = bounds.right;
            let top = bounds.top;
            let origin = [left, top];//左上角
            let extent = [left, bottom, right, top];//图层范围
            //获取超图发布的REST图层（自定义比例尺）
            let layer = getRESTLayer(layerUrl,layerID,origin,extent,mapJSONObj,17);
            that.map.addLayer(layer);
            //设置图层叠加顺序
            layer.setZIndex(zIndex);
            //添加到REST图层数组
            that.allRestVectorLayerArray[iIndex][jIndex].restTileLayer = layer;
            if(layerID && layerID!==""){
              //设置临时图层ID
              that.allRestVectorLayerArray[iIndex][jIndex].tempLayerId = layerID;
            }
            //缩放到图层范围
            that.map.getView().fit(extent, {padding: [50, 50, 50, 50]});
            //图层范围
            let bbox = extent.join(",");
            //图层显示名称
            let realName = that.allRestVectorLayerArray[iIndex][jIndex].name;
            //获取图例
            that.getLayerLegend(realName,layerUrl,bbox);//根据url获取图层图例信息
          }
        });
      },
      getLayerLegend(realName,layerUrl,bbox){//根据url获取图层图例信息
        let that = this;
        layerUrl += '/legend.json?bbox='+bbox;
        layerUrl += '&returnVisibleOnly=false';//是否只返回当前地图范围内可见要素的图例。默认为 false
        //图层图例信息查询
        let httpRequest = new XMLHttpRequest();//第一步：建立所需的对象
        httpRequest.open('GET', layerUrl, true);//第二步：打开连接  将请求参数写在url中  ps:"http://localhost:8080/rest/xxx"
        httpRequest.send();//第三步：发送请求  将请求参数写在URL中
        /**
         * 获取数据后的处理程序
         */
        httpRequest.onreadystatechange = function () {
          if (httpRequest.readyState == 4 && httpRequest.status == 200) {
            let json = httpRequest.responseText;//获取到json字符串，还需解析
            let obj = JSON.parse(json);
            let layerLegends = obj.layerLegends;
            if(layerLegends!=null && layerLegends.length>0){
              let html = '';
              for(let i=0;i<layerLegends.length;i++){
                let layerLegend = layerLegends[i];
                //获取图层名称
                let layerName = layerLegend.layerName;
                let legends = layerLegend.legends;
                if(legends!=null && legends.length>0){
                  if(layerName.indexOf("#")!=-1 && legends.length==1){
                    let textImgUrl = iServerHttp() + "/iserver/manager/static/Theme/image/LabelUniform.png";
                    //文字图层不显示图例
                    if(legends[0].url==textImgUrl){
                      continue;
                    }
                  }
                  if(legends.length>1){//多图例图层
                    html += '<p style="text-align: center;font-weight: bold;">'+realName+'</p>';
                    for(let j=0;j<legends.length;j++){
                      let legend = legends[j];
                      let values = legend.values;
                      if(values==null){
                        continue;
                      }
                      let imageData = legend.imageData;
                      let contentType = legend.contentType;
                      let url = legend.url;
                      let label = legend.label;
                      let width = legend.width;
                      let height = legend.height;
                      let imgSrc = "data:image/jpeg;base64,"+imageData;
                      html += '<p style="height: '+height+'px;">';
                      html += '<img style="width:'+width+'px;height:'+height+'px" src="'+imgSrc+'" />';
                      html += '<span style="position: relative;top: -2px;left: 10px;height: 16px;font-size: 16px;">'+label+'</span>';
                      html += '</p>';
                    }
                  }else{//单一图例图层
                    let legend = legends[0];
                    let values = legend.values;
                    let imageData = legend.imageData;
                    let contentType = legend.contentType;
                    let url = legend.url;
                    let label = legend.label;
                    let width = legend.width;
                    let height = legend.height;
                    let imgSrc = "data:image/jpeg;base64,"+imageData;
                    html += '<p style="height: '+height+'px;">';
                    html += '<img style="width:'+width+'px;height:'+height+'px" src="'+imgSrc+'" />';
                    html += '<span style="position: relative;top: -2px;left: 10px;height: 16px;font-size: 16px;">'+realName+'</span>';
                    html += '</p>';
                  }
                }
              }
              //图例html
              that.$emit("getLegendHtml",{name:realName,legendHtml:html,show:true});
            }
          }
        };
      },
      //临时图层SQL查询更新并获取瓦片图层REST
      deleteRestMapTempLayersSet(layerUrl, layerID) {//删除超图临时图层
        let that = this;
        let url = encodeURI(layerUrl + "/tempLayersSet.rjson");
        //查询
        let httpRequest = new XMLHttpRequest();//第一步：建立所需的对象
        httpRequest.open('GET', url, true);//第二步：打开连接  将请求参数写在url中  ps:"http://localhost:8080/rest/xxx"
        httpRequest.send();//第三步：发送请求  将请求参数写在URL中
        //获取数据后的处理程序
        httpRequest.onreadystatechange = function () {
          if (httpRequest.readyState == 4 && httpRequest.status == 200) {
            let json = httpRequest.responseText;//获取到json字符串，还需解析
            let obj = JSON.parse(json);
            if (obj.length > 0) {
              for (let i = 0; i < obj.length; i++) {
                let path = obj[i].path;
                if (layerID != null && layerID != "") {//指定临时图层ID
                  if (obj[i].name == layerID) {
                    that.deleteTempLayersSet(path);//删除超图临时图层
                    break;
                  }
                } else {//全部临时图层
                  that.deleteTempLayersSet(path);//删除超图临时图层
                }
              }
            }
          }
        };
      },
      deleteTempLayersSet(url) {//删除超图临时图层
        url = encodeURI(url);
        let xhr = new XMLHttpRequest();//第一步：建立所需的对象
        xhr.open("DELETE", url, true);//第二步：打开连接  将请求参数写在url中
        xhr.send();//第三步：发送请求  将请求参数写在URL中
        // 获取数据后的处理程序
        xhr.onreadystatechange = function () {
          let readyState = xhr.readyState;
          if (readyState == 4) {
            let status = xhr.status;
            let responseText = xhr.responseText;
            let result = JSON.parse(responseText);
            console.log("deleteResult");
            console.log(result);
            if (result.succeed) {
              //that.$message({ message: '删除临时图层成功!', type: 'success' });
            } else {
              //that.$message({ message: '删除临时图层失败!', type: 'warning' });
            }
            xhr.onreadystatechange = function () { };
            xhr = null;
          }
        };
      },
      createRestMapTempLayersSet(iIndex,jIndex,layerUrl,zIndex,sqlText) {//查询REST图层信息并创建新的临时图层
        let url = encodeURI(layerUrl + "/layers.rjson");
        console.log("123---"+url);
        let that = this;
        //查询REST图层信息
        let httpRequest = new XMLHttpRequest();//第一步：建立所需的对象
        httpRequest.open('GET', url, true);//第二步：打开连接  将请求参数写在url中
        httpRequest.send();//第三步：发送请求  将请求参数写在URL中
        //获取数据后的处理程序
        httpRequest.onreadystatechange = function () {
          console.log(httpRequest);
          if (httpRequest.readyState == 4 && httpRequest.status == 200) {
            let json = httpRequest.responseText;//获取到json字符串，还需解析
            let obj = JSON.parse(json);
            if (obj.length > 0) {
              if (sqlText != null && sqlText != "") {
                for (let i = 0; i < obj.length; i++) {
                  let layers = obj[i].subLayers.layers;
                  for (let j = 0; j < layers.length; j++) {
                    layers[j].displayFilter = sqlText;//SQL查询过滤
                  }
                }
              }
              that.postTempLayersSet(iIndex,jIndex,layerUrl, zIndex, obj);//创建并获取超图临时图层
            }
          }
        };
      },
      postTempLayersSet(iIndex,jIndex,layerUrl, zIndex, obj) {//创建并获取超图临时图层
        let that = this;
        let url = encodeURI(layerUrl + "/tempLayersSet.rjson");
        let entry = JSON.stringify(obj);
        let xhr = new XMLHttpRequest();//第一步：建立所需的对象
        xhr.open("POST", url, true);//第二步：打开连接  将请求参数写在url中
        xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded; charset=UTF-8");
        //获取数据后的处理程序
        xhr.onreadystatechange = function () {
          let readyState = xhr.readyState;
          if (readyState == 4) {
            let status = xhr.status;
            let responseText = xhr.responseText;
            let result = JSON.parse(responseText);
            if (result.succeed) {
              let layerID = result.newResourceID;
              let newResourceLocation = result.newResourceLocation;
              //that.$message({ message: '创建临时图层成功!', type: 'success' });
              //查询超图临时图层
              //that.getMapTempLayer(layerUrl,layerID,zIndex);
              //根据layerUrl、临时图层layerID和zIndex查询并添加瓦片地图图层REST
              that.createMapRestLayer(iIndex,jIndex,layerUrl, layerID, zIndex);
            } else {
              //that.$message({ message: '创建临时图层失败!', type: 'warning' });
            }
            xhr.onreadystatechange = function () { };
            xhr = null;
          }
        };
        xhr.send(entry);//第三步：发送请求  将请求参数写在URL中
      },
      getMapTempLayer(iIndex,jIndex,layerUrl, layerID, zIndex) {//查询超图临时图层
        let that = this;
        let url = encodeURI(layerUrl + "/tempLayersSet.rjson");
        //查询
        let httpRequest = new XMLHttpRequest();//第一步：建立所需的对象
        httpRequest.open('GET', url, true);//第二步：打开连接  将请求参数写在url中  ps:"http://localhost:8080/rest/xxx"
        httpRequest.send();//第三步：发送请求  将请求参数写在URL中
        //获取数据后的处理程序
        httpRequest.onreadystatechange = function () {
          console.log(httpRequest);
          if (httpRequest.readyState == 4 && httpRequest.status == 200) {
            let json = httpRequest.responseText;//获取到json字符串，还需解析
            let obj = JSON.parse(json);
            if (obj.length > 0) {
              if (layerID != null && layerID != "") {
                for (let i = 0; i < obj.length; i++) {
                  if (obj[i].name == layerID) {
                    //根据layerUrl、临时图层layerID和zIndex查询并添加瓦片地图图层REST
                    that.createMapRestLayer(iIndex,jIndex,layerUrl, layerID, zIndex);
                    break;
                  }
                }
              } else {
                layerID = obj[0].name;//默认取第一个
                //根据layerUrl、临时图层layerID和zIndex查询并添加瓦片地图图层REST
                that.createMapRestLayer(layerUrl, layerID, zIndex);
              }
              that.$message({ message: '查询成功!', type: 'success' });
            } else {
              that.$message({ message: '无查询结果!', type: 'warning' });
            }
          }
        };
      },
      queryTempLayersSetBySql(layerUrl, zIndex, sqlText) {//根据SQL条件筛选更新并查询超图临时图层信息
        let that = this;
        let url = encodeURI(layerUrl + "/tempLayersSet.rjson");
        //查询
        let httpRequest = new XMLHttpRequest();
        httpRequest.open('GET', url, true);
        httpRequest.send();
        //获取数据后的处理程序
        httpRequest.onreadystatechange = function () {
          if (httpRequest.readyState == 4 && httpRequest.status == 200) {
            let json = httpRequest.responseText;//获取到json字符串，还需解析
            let obj = JSON.parse(json);
            if (obj.length > 0) {
              //let tempUrl = obj[0].path;
              let layerID = obj[0].name;//默认选第一个临时图层
              console.log("layerID");
              console.log(layerID);
              //更新超图临时图层信息
              that.getPutTempLayersSet(layerUrl, layerID, zIndex, sqlText);
            }
          }
        };
      },
      getPutTempLayersSet(layerUrl, layerID, zIndex, sqlText) {//更新超图临时图层信息
        let that = this;
        //查询
        let url = encodeURI(layerUrl + "/tempLayersSet/" + layerID + ".rjson");
        //查询
        let httpRequest = new XMLHttpRequest();//第一步：建立所需的对象
        httpRequest.open('GET', url, true);//第二步：打开连接  将请求参数写在url中  ps:"http://localhost:8080/rest/xxx"
        httpRequest.send();//第三步：发送请求  将请求参数写在URL中
        //获取数据后的处理程序
        httpRequest.onreadystatechange = function () {
          if (httpRequest.readyState == 4 && httpRequest.status == 200) {
            let json = httpRequest.responseText;//获取到json字符串，还需解析
            let obj = JSON.parse(json);
            if (obj.length > 0) {
              for (let i = 0; i < obj.length; i++) {
                let layers = obj[i].subLayers.layers;
                for (let j = 0; j < layers.length; j++) {
                  layers[j].displayFilter = sqlText;//SQL查询过滤
                }
              }
            }
            //更新超图临时图层信息
            that.putTempLayersSet(url, layerUrl, layerID, zIndex, obj);
          }
        };
      },
      putTempLayersSet(url, layerUrl, layerID, zIndex, obj) {//更新超图临时图层信息，获取临时图层
        let that = this;
        let entry = JSON.stringify(obj);
        let xhr = new XMLHttpRequest();//第一步：建立所需的对象
        xhr.open("PUT", url, true);//第二步：打开连接  将请求参数写在url中
        xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded; charset=UTF-8");
        //获取数据后的处理程序
        xhr.onreadystatechange = function () {
          let readyState = xhr.readyState;
          if (readyState == 4) {
            let status = xhr.status;
            let responseText = xhr.responseText;
            let result = JSON.parse(responseText);
            if (result.succeed) {
              //that.$message({ message: '更新临时图层成功!', type: 'success' });
              //查询超图临时图层
              //that.getMapTempLayer(layerUrl,layerID,zIndex);
              //根据layerUrl、临时图层layerID和zIndex查询并添加瓦片地图图层REST
              that.createMapRestLayer(layerUrl, layerID, zIndex);
            } else {
              //that.$message({ message: '更新临时图层失败!', type: 'warning' });
            }
            xhr.onreadystatechange = function () { };
            xhr = null;
          }
        };
        xhr.send(entry);//第三步：发送请求  将请求参数写在URL中
      },
    }
  }

</script>

<style scoped></style>